Transition 所支持的css属性
transition-property是用来指定当元素其中一个属性改变时执行transition效果: 所支持的属性类型如下:
color: 通过红、绿、蓝和透明度组件变换(每个数值处理)如:background-color,border-color,color,outline-color等css属性;length: 真实的数字 如:word-spacing,width,vertical-align,top,right,bottom,left,padding,outline-width,margin,min-width,min-height,max-width,max-height,line-height,height,border-width,border-spacing,background-position等属性;percentage:真实的数字 如:word-spacing,width,vertical-align,top,right,bottom,left,padding,outline-width,margin,min-width,min-height,max-width,max-height,line-height,height,border-width,border-spacing,background-position等属性;integer离散步骤(整个数字),在真实的数字空间,以及使用floor()转换为整数时发生 如:outline-offset,z-index等属性;number真实的(浮点型)数值,如:zoom,opacity,font-weight,等属性;transformlistrectangle:通过x, y, width 和 height(转为数值)变换,如:cropvisibility: 离散步骤,在0到1数字范围之内,0表示“隐藏”,1表示完全“显示”,如:visibilityshadow: 作用于color, x, y 和 blur(模糊)属性,如:text-shadowgradient: 通过每次停止时的位置和颜色进行变化。它们必须有相同的类型(放射状的或是线性的)和相同的停止数值以便执行动画,如:background-image- paint server (SVG): 只支持下面的情况:从
gradient到gradient以及color到color,然后工作与上面类似 - space-separated list of above:如果列表有相同的项目数值,则列表每一项按照上面的规则进行变化,否则无变化
- a shorthand property: 如果缩写的所有部分都可以实现动画,则会像所有单个属性变化一样变化
Transition 所支持的css属性的更多相关文章
- 十个实用但IE不支持的CSS属性
对IE浏览器尤其是IE6的抱怨基本已进入麻痹状态,偶尔甚至产生非常消极的想法:这个世界只有一个浏览器就好了,哪怕这唯一的浏览器就是IE6.当然,这样的想法是非常病态的,马上打消.本文里面,介绍了10个 ...
- 判断浏览器是否支持某个css属性
方法:直接判断浏览器是否支持某个CSS属性才是王道,document.documentElement.style 如:判断是否支持 transform if( 'MozTransform' in do ...
- animate支持的css属性
支持下列CSS 样式 * backgroundPosition * borderWidth * borderBottomWidth * borderLeftWidth * borderRightWid ...
- 检测浏览器是否支持某个css属性
以浏览器是否支持translate3d 为例说明,当然现代浏览器已经支持该属性.如果浏览器实现了带有前缀的某个属性,比如说支持-webkit-transform,但是不支持直接写transform,可 ...
- 测试浏览器是否支持某个CSS属性
花了几个小时写了个API,为了兼容多种用法和测试花了不少时间,求鞭打.嘲笑和建议. <!DOCTYPE HTML> <html lang="zh-CN"> ...
- 判断浏览器是否支持指定CSS属性和指定值
/** * @param attrName 属性名 * @param attrVal 属性值 * @returns {boolean} */ function isCssAttrSupported(a ...
- 原生JavaScript判断浏览器对CSS属性是否支持
/*判断浏览器是否支持某个css属性*/ function SupportCss(attrName){ var i=0, arr = SupportCss.opt.aBrowser, eleStyle ...
- Javascript检测浏览器对CSS属性的支持 /* supports */
//检测浏览器对CSS属性的支持 supports = (function() { var div = document.createElement('div'), vendors = 'Khtml ...
- CSS中浏览器开发商特定的CSS属性
浏览器制造商(像Microsoft.Mozilla等,还有WebKit的后台人员等)通常会为他们的浏览器增加新的功能来测试新的特性, 或者实现一直在考虑但还没有得到标准组织批准的CSS扩展.在这些情况 ...
随机推荐
- git删除分支
git branch -d branchname删除一个分支需要具备的条件: 1 如果待删除的分支没有upstream branch,那么待删除的分支需要合并到HEAD上,否则需要使用-D强制删除 2 ...
- 使用xml及java代码混合的方式来设置图形界面
参考<疯狂android讲义>第2版2.1节 设置android的图形界面有三种方法: 1.使用纯xml文件 2.使用纯java,代码臃肿复杂,不建议使用 3.使用xml与java混合,前 ...
- Dividing (hdu 1059 多重背包)
Dividing Sample Input 1 0 1 2 0 0 价值为1,2,3,4,5,6的物品数目分别为 1 0 1 2 0 0,求能否将这些物品按价值分为两堆,转化为多重背包.1 0 0 0 ...
- 常用两种数据交换格式之XML和JSON的比较
目前,在web开发领域,主要的数据交换格式有XML和JSON,对于XML相信每一个web developer都不会感到陌生: 相比之下,JSON可能对于一些新步入开发领域的新手会感到有些陌生,也可能你 ...
- js void运用
谈谈Javascript中的void操作符 http://segmentfault.com/a/1190000000474941 总结: void有如下作用: 通过采用void 0取undefined ...
- C# ToString()和Convert.ToString()的区别
一.一般用法说明 ToString()是Object的扩展方法,所以都有ToString()方法;而Convert.ToString(param)(其中param参数的数据类型可以是各种基本数据类型, ...
- uva 101 by sixleaves
这是一道很好的模拟题,用vector<int> p[maxn],建立模型,映射为maxn个堆.主要要掌握vector模拟堆操作的简单方法.接下来得思路是自顶向下的方式,逐步完善程序.首先根 ...
- python 性能优化
1.优化循环 循环之外能做的事不要放在循环内,比如下面的优化可以快一倍 2.使用join合并迭代器中的字符串 join对于累加的方式,有大约5倍的提升 3.使用if is 使用if is True比i ...
- WINDOWS 下搭建 OC 集成开发环境
Objective-C是苹果软件的编程语言,想要上机学习.调试,有一个集成开发环境(IDE)方便很多.有三类方法搭建Objective-C的集成开发环境: 1) 使用苹果的平台,集成开发环境使用X ...
- 【v2.x OGE教程 20】粒子效果
1.介绍 粒子系统表示三维计算机图形学中模拟一些特定的模糊现象的技术.而这些现象用其他传统的渲染技术难以实现的真实感的 game physics.常常使用粒子系统模拟的现象有火.爆炸.烟.水流.火花. ...