animation-play-state
animation-play-state:
css:
.play-state{
-webkit-animation:f1 2s 0.5s infinite linear forwards alternate;
-moz-animation:f1 2s 0.5s infinite linear forwards alternate;
position:relative;
left:10px;
width:100px;
height:100px;
margin:10px 0;
overflow:hidden;
}
.play-state:hover{
-webkit-animation-play-state:paused;
-moz-animation-play-state:paused;
}
@-webkit-keyframes f1{
0%{left:10px;}
100%{left:500px;}
}
@-moz-keyframes f1{
0%{left:10px;}
100%{left:500px;}
}
html:
<div class="play-state">鼠标移过来我就停,移走就运动,好听话哦!</div>
animation-play-state的更多相关文章
- CSS 奇技淫巧十八招
http://www.tuicool.com/articles/VZneI3 開始覺得自己會寫 CSS 也算有一段時間了,常常遇到一些非常實用的技巧不斷地反覆使用,但是我個人覺得對初學者來說很難從 ...
- 谈谈一些有趣的CSS题目(十四)-- 纯 CSS 方式实现 CSS 动画的暂停与播放!
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- 一款开源免费的WPF图表控件ModernuiCharts
一款简洁好看的Chart控件 支持WPF.silverlight.Windows8 ,基本够用,主要是开源免费的.(商业控件ComponentOne for WPF要4w多呢) This proj ...
- 比较不错的几款开源的WPF Charts报表控件
UWP Community Toolkit 1. ModernUIChart Code: http://modernuicharts.codeplex.com/ Available Charts Co ...
- Unity编辑器 - 编辑器控制特效播放
编辑器控制特效播放 Unity的动画编辑器不能预览粒子系统的播放,为了方便预览特效,设想制作一个预览特效的工具,通常一个特效有三种组件: - Animation - Animator - Partic ...
- 完整学习使用CSS动画【翻译】
注:原文有较大改动 使用keyframes, animation属性,例如timing, delay, play state, animation-count, iteration count, d ...
- 纯 CSS 方式实现 CSS 动画的暂停与播放!
开本系列,谈谈一些有趣的 CSS 题目,题目类型天马行空,想到什么说什么,不仅为了拓宽一下解决问题的思路,更涉及一些容易忽视的 CSS 细节. 解题不考虑兼容性,题目天马行空,想到什么说什么,如果解题 ...
- 翻遍互联网都找不到的解决方案,一行代码轻松实现 Gitbook 默认折叠左侧菜单效果
Gitbook 是一款产品文档构建工具,也可以用于构建个人博客,默认情况下电脑端访问时左侧菜单是展开状态,可偏偏有人想要实现默认折叠效果,于是诞生了这篇文章! 善良的我选择帮助别人 可能是网上关于 G ...
- React-native/React 公告滚动组件(原生代码)
编写不易, 希望大家点赞 import React, {PureComponent} from 'react'; import {Animated, Easing, View} from 'react ...
- Taro框架---左滑动删除
index.js import Taro, { Component } from '@tarojs/taro' import { View,ScrollView } from '@tarojs/com ...
随机推荐
- DragonBones龙骨插槽的隐藏
参考: 插槽中对象的显示与隐藏问题 let factory = dragonBones.EgretFactory.factory; factory.parseDragonBonesData(RES.g ...
- 【CF653G】Move by Prime 组合数
[CF653G]Move by Prime 题意:给你一个长度为n的数列$a_i$,你可以进行任意次操作:将其中一个数乘上或者除以一个质数.使得最终所有数相同,并使得操作数尽可能小.现在我们想要知道$ ...
- dhroid - NetJSONAdapter 网络化的adapter
关于adapter 我想对于大家来说已经不陌生了,基本应用都会用的很多,不知道现在你是不是还是按一定的套路写很多代码去实现adapter我想大多数人还是写个adapter继承自baseadapter ...
- 【C#】基础知识
C#常用函数表1.DateTime 数字型 System.DateTime currentTime=new System.DateTime(); 1.1 取当前年月日时分秒 currentTime=S ...
- vue--循环列表
<template> <div id="app"> <p v-for="x in list">{{x}}</p> ...
- python实现简单购物车系统(练习)
#!Anaconda/anaconda/python #coding: utf-8 #列表练习,实现简单购物车系统 product_lists = [('iphone',5000), ('comput ...
- 纯CSS绘制的三角形箭头图案【原创】
参考:http://www.webhek.com/css-triangles/ 使用上下左右的三角形箭头标志,直接用css即可完成,直接附上代码. css: div#up { width: 0px; ...
- 2018-2019-2 20165330《网络对抗技术》Exp6 信息搜集与漏洞扫描
目录 基础问题 相关知识 实验目的 实验内容 实验步骤 实验总结与体会 实验目的 掌握信息搜集的最基础技能与常用工具的使用方法. 返回目录 实验内容 各种搜索技巧的应用 使用搜索引擎 搜索网址目录结构 ...
- python3学习笔记(1)_string
#python学习笔记 17/07/07 # !/usr/bin/evn python3 # -*- coding:utf-8 -*- #r"" 引号当中的字符串不转义 #练习 # ...
- php iconv() : Detected an illegal character in input string
php iconv() : Detected an illegal character in input string_php技巧_脚本之家 https://www.jb51.net/article/ ...