CSS3.0动画之hover---Y轴----3D旋转
div#div2
{
display: table; width: 100%; height: 100%;
text-decoration: none;
outline: none;
-webkit-transition: all 800ms ease-out; /* CSS3 transition. Last value is pause before transition play */
-moz-transition: all 800ms ease-out;
transition: all 800ms ease-out;
}
div#div2:hover
{
color: black; /* color of icon font onMouseover */
-webkit-transform: rotateY(180deg);
-moz-transform: rotateY(180deg); /* flip horizontally 180deg*/
transform: rotateY(180deg);
-webkit-transition-delay: 0.2s;
-moz-transition-delay: 0.2s;
transition-delay: 0.2s;
}
CSS3.0动画之hover---Y轴----3D旋转的更多相关文章
- css3常用动画+动画库
一.animates.css animate.css是来自dropbox的工程师Daniel Eden开发的一款CSS3的动画效果小类库.包含了60多款不同类型的CSS3动画,包括:晃动,闪动,各种淡 ...
- Css3 笔记 动画 和定位属性
transform 变形属性属性:translate 平移,rotate 旋转, scale 缩放,skew 倾斜 ◆ translate :指定对象的2D平移第一个参数对应X轴,第二参数对应Y轴:如 ...
- 学习 | css3基本动画之demo篇
移动端使用的框架是zepto,但是zepto的内置对象没有传统的animate这个方法,效果都是需要css3来实现的,zepto也不支持fadeIn和fadeOut等一些基本的动画,基于这一现状,我自 ...
- echarts使用笔记四:双Y轴
1.双Y轴显示数量和占比 app.title = '坐标轴刻度与标签对齐'; option = { title : { //标题 x : 'center', y : 5, text : '数量和占比图 ...
- Flash图表控件FusionCharts自定义图表y轴最大/最小值
自定义图表y轴的最大值和最小值 用户可以使用FusionCharts图表中<chart>元素的yAxisMaxValue和yAxisMinValue属性设置图表限制. 示例: <ch ...
- Python教程:matplotlib 绘制双Y轴曲线图
前言 本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者:数据皮皮侠 双X轴的可以理解为共享y轴 ax1=ax.twiny() ...
- 纯CSS3超酷3D旋转立方体动画特效
简要教程 这是一款神奇的纯 CSS3 立方体动画特效插件.使用CSS3来制作动画效果已经成为WEB前端开发的一种时尚,从简单的颜色和尺寸动画,到复杂的旋转.翻转动画, CSS3 展现了它无穷的魅力.使 ...
- android3D动画,绕y轴旋转
原文地址:http://blog.csdn.net/x_i_a_o_h_a_i/article/details/40449847 其实网上的3D旋转的例子很多,在这里我只是想把其代码做一个解释. 先上 ...
- 【巩固】CSS3的3D动画 ——3D旋转(1)
最近学了妙味的css3的动画,2D,3D的都有,先写一个最简单的3d翻转效果,鼠标移入div,正反面翻转效果. 注意点有: 要给正反面外面加个父级: transform-style: preserve ...
随机推荐
- mysql 日期函数格式
mysql中的from_unixtime函数的format表达式字段描述: %M 月名字(January……December) %W 星期名字(Sunday……Saturday) %D 有英语前缀的 ...
- Linux内核加载全流程
无论是Linux还是Windows,在加电后的第一步都是先运行BIOS(Basic Input/Output System)程序——不知道是不是所以的电脑系统都是如此.BIOS保存在主板上的一个non ...
- struts2 后台action向前端JSP传递参数的问题
后台有个方法,里面部分代码如下: System.out.print("alter:"+user.getId()); User temp=userservice.getUserByU ...
- javaweb学习总结十六(tomcat服务器的使用、虚拟目录的映射)
一:tomcat服务器的目录 1:目录结构 2:web应用程序介绍 二:虚拟目录的映射 假如我在E盘建立一个目录web,里面存放1.html文件,我想让外界访问 1:直接在conf目录下的server ...
- CF Error Correct System
Error Correct System time limit per test 2 seconds memory limit per test 256 megabytes input standar ...
- hdu 4571 floyd+动态规划
思路: 我们先求一遍floyd,将各点的最短距离求出,然后将点按si的升序排序.dp[i][k]表示第i个点在第j时间所获得的最大效益,那么 dp[i][k]=max(dp[ i ][ k ] , ...
- 嵌入式开发笔记 - U-Boot相关
1.U-boot使用准备 1.1 U-boot下载 通过德国的denx软件中心提供的FTP下载合集,下载网址: ftp://ftp.denx.de/pub/u-boot/
- Spring 数据源配置三:多数据源
在上一节中,我们讲述了多数据的情况: 1. 数据源不同(数据库厂商不同, 业务范围不同, 业务数据不同) 2. SQL mapper 文件不同, 3. mybatis + 数据方言不同 即最为简单的多 ...
- 【C语言】01-第一个c程序代码分析
创建了一个C程序,接下来分析一下里面的代码. 项目结构如下: 一.代码分析 打开项目中的main.c文件(C程序的源文件拓展名为.c),可以发现它是第一个C程序中的唯一一个源文件,代码如下: 1 #i ...
- YSPASYS 中小型企业简单员工评价考核系统
背景:公司运营接近2年时间了,随着不断的有员工入职.离职,使用信息化管理员工各类信息是一件很有必要的事儿.诸如员工基本信息,内部公告,资产盘点,客户管理,工作周报,优秀员工评选,请假.外出.报销.采购 ...