css3在网站开发中的普及,使广大开发工程师越来越重视css3的应用于操作,是由于浏览器的不同,复杂繁琐的css3前缀就成了困扰我的的一个难题,如何解决css3前缀带来的困扰呢,在这里和大家分享个js函数,通过它可以很方便的解决css3前缀问题。
obj为要加样式的元素名称,attrObj为json格式的数据为要加的样式。
setCss3(li,{transform:translateZ(150px) rotateX(150deg)"})
1 function setCss3 (obj,attrObj) { 2 for (var i in attrObj) { 3 var newi=i; 4 if(newi.indexOf("-")>0){ 5 var num=newi.indexOf("-"); 6 newi=newi.replace(newi.substr(num,2),newi.substr(num+1,1).toUpperCase()); 7 } 8 obj.style[newi]=attrObj[i]; 9 newi=newi.replace(newi.charAt(0),newi.charAt(0).toUpperCase()); 10 obj.style["webkit"+newi]=attrObj[i]; 11 obj.style["moz"+newi]=attrObj[i]; 12 obj.style["o"+newi]=attrObj[i]; 13 obj.style["ms"+newi]=attrObj[i]; 14 } 15 }