css3 旋转出现动画
@-moz-keyframes daf{
0% {
-moz-transform: rotate(-360deg) scale(0.2);
-webkit-transform: rotate(-360deg) scale(0.2);
-o-transform: rotate(-360deg) scale(0.2);
-ms-transform: rotate(-360deg) scale(0.2);
transform: rotate(-360deg) scale(0.2);
}
100% {
-moz-transform: none;
-webkit-transform: none;
-o-transform: none;
-ms-transform: none;
transform: none;
}
}
.daf:not(:target){
animation-name: daf;
animation-duration: 1.5s;
animation-timing-function: linear;
-webkit-animation-name: daf;
-webkit-animation-duration:1.5s;
-moz-animation-name: daf;
-moz-animation-duration: 1.5s;
-o-animation-name: daf;
-o-animation-duration:1.5s;
-ms-animation-name: daf;
-ms-animation-duration: 1.5s;
}
css3 旋转出现动画的更多相关文章
- css3旋转倾斜3d小动画
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- 纯CSS3超酷3D旋转立方体动画特效
简要教程 这是一款神奇的纯 CSS3 立方体动画特效插件.使用CSS3来制作动画效果已经成为WEB前端开发的一种时尚,从简单的颜色和尺寸动画,到复杂的旋转.翻转动画, CSS3 展现了它无穷的魅力.使 ...
- 纯CSS3悬停图标旋转导航动画代码
分享一款纯CSS3悬停图标旋转导航动画代码.这是一款鼠标移到图标上动画旋转显示导航菜单.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div id="x_con ...
- 模仿百度首页“元宵节汤圆”动图,并实现360°不停旋转(CSS3的animation动画效果)
模仿百度首页“元宵节汤圆”动图,并实现360°不停旋转(CSS3的animation动画效果) 效果图: 切图地址: https://ss1.bdstatic.com/5eN1bjq8AAUYm2zg ...
- 用css3实现摩天轮旋转的动画效果
用css3实现摩天轮旋转的动画效果 1.CSS3 @keyframes 规则如需在 CSS3 中创建动画,您需要学习 @keyframes 规则.@keyframes 规则用于创建动画.在 @keyf ...
- CSS3轻松实现彩色旋转六面体动画
一.效果预览: 二.基本思路: 1.首先这个一个自动触发的动画,因此应使用animation设计,包括自动组装和组装完成后自动旋转的过程: 2.当鼠标放上去的时候六个面及上面的字体均变色,应在六个面设 ...
- CSS3中的动画效果记录
今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...
- CSS3的自定义动画帧
CSS3新增的动画帧非常绚丽,可以简单实现一些动画效果,目前除IE外各大主流浏览器都支持 本文演示三个:transform: scale3d(x, y, z)-缩放;.transform: trans ...
- 3D Grid Effect – 使用 CSS3 制作网格动画效果
今天我们想与大家分享一个小的动画概念.这个梦幻般的效果是在马库斯·埃克特的原型应用程序里发现的.实现的基本思路是对网格项目进行 3D 旋转,扩展成全屏,并呈现内容.我们试图模仿应用程序的行为,因此 ...
随机推荐
- 关于事件监听机制的总结(Listener和Adapter)
记得以前看过事件监听机制背后也是有一种设计模式的.(设计模式的名字记不清了,只记得背后实现的数据结构是数组.) 附上事件监听机制的分析图: 一个事件源可以承载多个事件(只要这个事件源支持这个事件就可以 ...
- void指针、NULL指针和未初始化指针
一个指针可以被声明为void类型,比如void *x.一个指针可以被赋值为NULL.一个指针变量声明之后但没有被赋值,叫做未初始化指针. 1 2 3 4 5 6 7 8 9 10 11 12 13 1 ...
- windows共享文件夹如何让CentOS 6.5读取
http://www.111cn.net/sys/CentOS/74104.htm 工作需要,需要把本地win7共享的文件夹让CenotOS 6.5服务器临时使用一下,以下是CentOS 6.5系统挂 ...
- sql 中条件in参数问题
经常遇到条件为in的模糊查询,sql传参可以在service中直接传递参数,不必使用占位符 select * from ud_order where status in ("+status+ ...
- 微软阵营企稳的利好消息:.NET开源、Visual Studio免费
今天各个IT社区,头版头条说的是微软.NET开源了.宇宙中最好的IED–Visual Studio Community 2013将免费提供给用户的消息. <宇宙中最强大的开发环境免费了!> ...
- 第十四篇、Ajax与Json
1.Ajax的核心知识 1.1 XMLHttpRequest对象 function loadName(){ var xmlHttp; if(window.XMLHttpRequest){ xmlHtt ...
- spring.net 和 mybatis.net
demo是整合现有的spring.net 和 mybatis.net 完成的控制台程序,需要注意的地方:关于Config文件夹中的config文件的属性设定:同时保证Providers.config默 ...
- TLF相关资料
1\(转)http://blog.csdn.net/hu36978/article/details/5796165 TFL 一般先创建TextFlow 通过控制flowComposer属性来控制文本 ...
- (poj)1806 Currency Exchange
题目链接:http://poj.org/problem?id=1860 Description Several currency exchange points are working in our ...
- virtual析构函数的作用
C++ Primter中讲“在 C++ 中,基类必须指出希望派生类重写哪些函数,定义为 virtual 的函数是基类期待派生类重新定义的,基类希望派生类继承的函数不能定义为虚函数”. 析构函数是为了在 ...