css3 样式过度器 Transition
transition 简写属性，用于在一个属性中设置四个过渡属性。
1. transition 把鼠标指针放到 div 元素上，其宽度会从 100px 逐渐变为 300px：
eg: div{width:100px;transition: width 2s;-moz-transition: width 2s; /* Firefox 4 */-webkit-transition: width 2s; /* Safari 和 Chrome */-o-transition: width 2s; /* Opera */}
2.transition-property 把鼠标指针放到 div 元素上，会产生带有平滑改变元素宽度的过渡效果：(规定应用过渡的 CSS 属性的名称)。
eg:div{width:100px;height:100px;background:blue;transition-property: width;transition-duration: 2s;}
3.transition-duration 定义过渡效果花费的时间。
eg:div{width:100px;height:100px;background:blue;transition-property: width;transition-duration: 2s;}
4transition-timing-function 规定过渡效果的时间曲线。
语法 transition-timing-function: linear|ease|ease-in|ease-out|ease-in-out|cubic-bezier(n,n,n,n);
5 transition-delay 规定过渡效果何时开始。
eg 在过渡效果开始前等待 2 秒：div{transition-delay: 2s;-moz-transition-delay: 2s; /* Firefox 4 */-webkit-transition-delay: 2s; /* Safari 和Chrome */-o-transition-delay: 2s; /* Opera */}
最新文章
- JavaScript高级程序设计学习笔记--表单脚本
- memcached tomcat maven 学习记录
- HTTP狀態碼
- 使用maven镜像
- 开发环境中biztalk项目设置注意事项(转)
- "2013":爱你不容易
- 初涉SQL Server性能问题（4/4）：列出最耗资源的会话
- SolrCloud阶段总结
- Tomcat 加入windows 服务自启动设置
- 关于bootstrap列偏移的两种方式
- Swift -> Let & Var 背后编程模式 探讨
- HDU5058
- VS2017 + QT5 + C++开发环境搭建和计算器Demo测试
- C#Url处理类
- SAP BPC方案介绍
- Codeforces 948D Perfect Security(字典树)
- numpy和Matplotlib篇---2
- 怎样更改SQL Server 2008的身份验证方式
- java 抽象类 以及模块方法设计模式，接口
- 使用redis4.0.1和redis-cluster搭建集群并编写重启shell脚本