本站电脑知识提供电脑入门知识,计算机基础知识,计算机网络应用基础知识,电脑配置知识,电脑故障排除和电脑常识大全,帮助您更好的学习电脑!不为别的,只因有共同的爱好,为中国互联网发展出一分力!
javascript_怎样用js修正浏览器css私有属性详解
javascript_怎样用js修正浏览器css私有属性详解:从某博客的JS文件里学习到的~所以本着共享的精神!其实我也不知道这种技术叫啥目前有很多css属性都是私有方式实现的,想用就要加一堆破前缀,-moz-,-ms-,-o-,-webkit-;如果在样式表里改一个值就需要从新把所由的都改一遍非常麻烦。
或者用dom style去设置一个元素的style也非常麻烦,大部分都是驼峰式的,firefox是个另类,MozTransition要处理成这样的,不管用正则还是别的方式都不是很好处理。
小的简单封装了一个方法,用起来还不错。
用dom style的cssText直接注入或者,调用后拷贝到样式表都比较方便。
fixCSS('transition','all .8s ease-in 1s');
function fixCSS(a,p){
return '-moz-#:@;-ms-#:@;-o-#:@;-webkit-#:@;#:@;'.replace(/#:@/g,a+':'+p);
} |
调用这个方法后会返回这样的字符串
"-moz-transition:all .8s ease-in 1s;-ms-transition:all .8s ease-in 1s;-o-transition:all .8s ease-in 1s;-webkit-transition:all .8s ease-in 1s;transition:all .8s ease-in 1s;" |
用cssText设置后,浏览器只会识别自己私有的那部分代码,其他会忽略掉,所以还是比较理想的。如果要修改样式表就更方便了,拷贝粘贴足以。
不过opera有个问题,他会把所有的字符串赋值给style,但是功能并没有影响。
另外要注意的是:
cssText属性,会重写style的所有值。
ps:css已经进入css4时代了,mediaquery被纳入规范。
关于css私有属性的处理大家还有更好的思路,可以分享一下啦,万分感激!哈哈。。。
学习教程快速掌握从入门到精通的电脑知识
|