@-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 旋转出现动画的更多相关文章

  1. css3旋转倾斜3d小动画

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  2. 纯CSS3超酷3D旋转立方体动画特效

    简要教程 这是一款神奇的纯 CSS3 立方体动画特效插件.使用CSS3来制作动画效果已经成为WEB前端开发的一种时尚,从简单的颜色和尺寸动画,到复杂的旋转.翻转动画, CSS3 展现了它无穷的魅力.使 ...

  3. 纯CSS3悬停图标旋转导航动画代码

    分享一款纯CSS3悬停图标旋转导航动画代码.这是一款鼠标移到图标上动画旋转显示导航菜单.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div id="x_con ...

  4. 模仿百度首页“元宵节汤圆”动图,并实现360°不停旋转(CSS3的animation动画效果)

    模仿百度首页“元宵节汤圆”动图,并实现360°不停旋转(CSS3的animation动画效果) 效果图: 切图地址: https://ss1.bdstatic.com/5eN1bjq8AAUYm2zg ...

  5. 用css3实现摩天轮旋转的动画效果

    用css3实现摩天轮旋转的动画效果 1.CSS3 @keyframes 规则如需在 CSS3 中创建动画,您需要学习 @keyframes 规则.@keyframes 规则用于创建动画.在 @keyf ...

  6. CSS3轻松实现彩色旋转六面体动画

    一.效果预览: 二.基本思路: 1.首先这个一个自动触发的动画,因此应使用animation设计,包括自动组装和组装完成后自动旋转的过程: 2.当鼠标放上去的时候六个面及上面的字体均变色,应在六个面设 ...

  7. CSS3中的动画效果记录

    今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...

  8. CSS3的自定义动画帧

    CSS3新增的动画帧非常绚丽,可以简单实现一些动画效果,目前除IE外各大主流浏览器都支持 本文演示三个:transform: scale3d(x, y, z)-缩放;.transform: trans ...

  9. 3D Grid Effect – 使用 CSS3 制作网格动画效果

    今天我们想与大家分享一个小的动画概念.这个梦幻般的效果是在马库斯·埃克特的原型应用程序里发现的​​.实现的基本思路是对网格项目进行 3D 旋转,扩展成全屏,并呈现内容.我们试图模仿应用程序的行为,因此 ...

随机推荐

  1. myeclipse安装本地maven fastdfs_client.jar

    为了方便应用程序的访问FastDFS,官网提供了fastdfs-client-java,以便更好的与应用程序结合使用. 下载fastdfs-client-java源码添加到项目工程里面,添加配置文件: ...

  2. ElasticSearch Search API 简介

    REST request URI curl 'localhost:9200/bank/_search?q=*&pretty' 1. localhost:9200/bank/_search,以 ...

  3. 将Oracle表导入到Access方法,已经安装了Access但Win7提示 找不到access driver

    已经安装了Access但Win7提示 找不到access driver: 1.打开 "C:\Windows\SysWOW64\odbcad32.exe" 2.管理员cmd运行 命令 ...

  4. Ubuntu lnmp安装记录

    参考了: Ubuntu 14.04 LTS 安装 LNMP Nginx\PHP5 (PHP-FPM)\MySQL 在访问 info.php的时候,我显示的是502错误.后面我参考了: Ubuntu15 ...

  5. IIS经典模式和集成模式在管道模型中的不同

    问题: 有时候我们配置IIS后可能运行提示以下错误: HTTP 错误 500.23 - Internal Server Error 检测到在集成的托管管道模式下不适用的 ASP.NET 设置. 其中由 ...

  6. VBA实现随意输入组合码,查询唯一标识码

    记录背景: 需要在excel中查询出组合码,对应的唯一标识码. 举例 组合码:4+5+6+9+1*2   标识码:A1 界面随意输入组合码:1*2+4+5+6+9  输出标识码:A1 VBA实现: P ...

  7. C++实用数据结构:二叉索引树

    看下面这个问题(动态连续和查询): 有一个数组A(长度为n),要求进行两种操作: add(i,x):让Ai增大x: query(a,b):询问Aa+Aa+1+...+Ab的和: 若进行模拟,则每次qu ...

  8. Java大数操作类

    Java的大数操作分为BigInteger和BigDecimal,但这两给类是分开使用的,有时候在编程的时候显得略微繁琐,现在编写了一个将二者合二为一的大数操作类. 大数操作类代码如下: packag ...

  9. 使用C++11安全的在线程中控制UI

    本篇文章由:http://www.sollyu.com/using-the-c11-secure-online-process-control-ui/ 说明 首先这里使用的是 Visual Studi ...

  10. MFC通过ADO操作Access数据库

    我在<VC知识库在线杂志>第十四期和第十五期上曾发表了两篇文章——“直接通过ODBC读.写Excel表格文件”和“直接通过DAO读.写Access文件”,先后给大家介绍了ODBC和DAO两 ...