javascript 操作 css3

原创于 2014-04-18 12:44:22 发布 · 119 阅读

CC 4.0 BY-SA版权

文章标签：

本文分享了在学习coder宝宝css3视频教程中的一些实用技巧和心得，包括如何使用自定义函数setCss3来高效设置CSS样式，特别针对transform属性的使用进行了详细解释。教程覆盖了transform-origin和transform等关键概念，旨在帮助开发者更深入地理解并应用CSS3的动画和过渡效果。

这个是在学习coder 宝宝css3视频教程里看到的，觉得不错，拿出来分享一下。

 function setCss3 (obj,attrObj) {
   for (var i in attrObj) {
     var newi=i;
	 if(newi.indexOf("-")>0){
	   var num=newi.indexOf("-");
	   newi=newi.replace(newi.substr(num,2),newi.substr(num+1,1).toUpperCase());
	 }
	 obj.style[newi]=attrObj[i];
	 newi=newi.replace(newi.charAt(0),newi.charAt(0).toUpperCase());
	 obj.style["webkit"+newi]=attrObj[i];
	 obj.style["moz"+newi]=attrObj[i];
	 obj.style["o"+newi]=attrObj[i];
	 obj.style["ms"+newi]=attrObj[i];
   }
  }

var el=document.getElementById("div");
setCss3(el,{"transform-origin":"left top",transform:"scale(1,1)"});