animation效果
添加一个颜色灰渐变的动画效果。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<style type="text/css">
div.dd {
background: green;
width: 200px;
height: 200px;
-webkit-transition:background 1s ease-in, width 1s ease-in 1s;
}
@-webkit-keyframes mycolor {
0%{
background: red;
}
30% {
background: blue;
}
70%{
background: yellow;
}
100% {
background: white;
}
}
div.dd:hover {
-webkit-animation-name:mycolor;
-webkit-animation-duration:5s;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count:1;
}
</style>
</head>
<body>
<div class="dd"></div>
</body>
</html>
animation效果的更多相关文章
- 动画---图形图像与动画(三)Animation效果的XML实现
使用XML来定义Tween Animation 动画的XML文件在工程中res/anim目录,这个文件必须包含一个根元素,可以使<alpha><scale> <trans ...
- Swift 4.0.2 按下tab bar item时， item会有内缩的animation效果(如同Twitter的tab bar 效果一样)
先上效果图: 假设 tab bar items 有5个.tag为0,1,2,3,4.storyboard中tab bar controller继承的class叫做xxxVC. class xxxVC: ...
- Animation
Animation 效果 用法 1.非常简单,导入两个文件(UIView+SetRect) (UIView+ImageEffects) 源码 github源码:https://github.com/m ...
- Android实现左右滑动效果
本示例演示在Android中实现图片左右滑动效果. 关于滑动效果,在Android中用得比较多,本示例实现的滑动效果是使用ViewFlipper来实现的,当然也可以使用其它的View来实现.接下来 ...
- Android 实现左右滑动效果ViewFlipper终结【转】
本示例演示在Android中实现图片左右滑动效果. 关于滑动效果,在Android中用得比较多,本示例实现的滑动效果是使用ViewFlipper来实现的,当然也可以使用其它的View来实现.接下来 ...
- CSS3+HTML5特效7 - 特殊的 Loading 效果
效果如下 实现原理: 利用CSS3的@keyframes规则创建动画效果: 使用CSS3的animation效果完成滚动切换. 代码说明: 样式表中@-webkit-keyframes及@ke ...
- css3动画：transition和animation
概述 之前写过css3 动画与display:none冲突的解决方案,但是最近却发现,使用animation效果比transition好得多,而且不和display:none冲突.下面我把相关新的记录 ...
- 背景图片移动插件MyFloatingBg(浮动背景图效果，可让背景随着页面的滚动而滚动)
MyFloatingBg这插件可以帮助你在网页上加入可移动背景Background.你可以用于整个文件的背景,或是某几个banner的背景. 它可支持简单的animation效果,你不用去做一个fla ...
- android开发之Animation（五）
android开发之Animation的使用(五) 本博文主要讲述的是Animation中的AnimationLisenter的用法,以及此类的一些生命周期函数的调用,代码实比例如以下: MainAc ...
随机推荐
- Unity3D protobuf-net使用方式
1.下载protobuf-net 2.创建Unity工程,创建一个Plugins文件夹,将protobuf-net解压把里面得protobuf-net放到Plugins 3.创建一个名为mcs的文本文 ...
- 【转】CCScale9Sprite和CCControlButton
转自:http://blog.csdn.net/nat_myron/article/details/12975145 在2dx下用到了android下的.9.png图片,下面是原图 查了一下2dx ...
- android中SimpleCursorAdapter _id错误的问题
作为一个android新手,在绑定数据的时候是这样的 ListView listview=(ListView)this.findViewById(R.id.listView1); XJDal xj=n ...
- 【CF720D】Slalom 扫描线+线段树
[CF720D]Slalom 题意:一个n*m的网格,其中有k个矩形障碍,保证这些障碍不重叠.问你从(1,1)走到(n,m),每步只能往右或往上走,不经过任何障碍的方案数.两种方案被视为不同,当且仅当 ...
- 服务器群秒级别文件同步（ssh+SHELL）
1.介绍 \ 2.业务服务器远程更新浏览服务器文件的脚本 #!/bin/bash operate=$ ip=$ conf_file="/var/www/html/test/ip_list&q ...
- Solve minGW g++ has stopped working 程序停止运行
之前在机子装了个很早版本的MinGW,苦于不支持c++11,所以打算卸载掉安装个新版本的.可是网上找了很多版本装好后,编译成功,运行的时候总是弹出 *.exe has stopped working的 ...
- HttpClient 学习整理【转】
转自 http://www.blogjava.net/Alpha/archive/2007/01/22/95216.html HttpClient 是我最近想研究的东西,以前想过的一些应用没能有很好的 ...
- jQuery ajax的前台代码编写
jQuery ajax的前台代码: <script type="text/javascript" src="/include/jquery/jquery-1.1.3 ...
- UOJ #146. 【NOIP2015】信息传递 连通分量 tarjan模板题
http://uoj.ac/problem/146 题解:强连通分量 tarjan模板题.同时试了一下codeblock #include<bits/stdc++.h> using nam ...
- Python：fromkeys()方法
简介 Python 字典(Dictionary) fromkeys() 函数用于创建一个新字典,以序列seq中元素做字典的键,value为字典所有键对应的初始值. 语法 fromkeys()方法语法: ...