[f]添加cssTransform屬性的方法

標籤：style   blog   io   color   ar   使用   for   sp   div   

 

添加css3的一些Transform的屬性

使用方法：

cssTransform(oDiv[0], ‘scale‘, 300)(‘rotate‘, 300);

ps：可以完成一個變形繼續下一個變形；

函數如下：

function cssTransform(obj, attr, value) {   if (arguments.length == 2) {       if (attr == ‘scale‘ || attr == ‘rotate‘ || attr == ‘rotateY‘ || attr == ‘translateZ‘) {           var arr = ["Webkit", "Moz", "O", "ms", ""];           var sVal = ‘‘;           if (!obj.$Transform) {               obj.$Transform = {};           }           for (var i = 0; i < arr.length; i++) {               obj.style[arr[i] + "Transform"] = sVal;               switch (attr) {                   case ‘scale‘:                       sVal = typeof(obj.$Transform[attr]) == ‘number‘ ? obj.$Transform[attr] : 100;                       break;                   default:                       sVal = obj.$Transform[attr] ? obj.$Transform[attr] : 0;               }           }       }       var sCur = obj.currentStyle ? obj.currentStyle[attr] : document.defaultView.getComputedStyle(obj, false)[attr];       if (attr == ‘opacity‘) {           return parseInt(parseFloat(sCur) * 100);       } else {           return parseInt(sCur);       }   } else   if (arguments.length == 3) {       switch (attr) {           case ‘scale‘:           case ‘rotate‘:           case ‘rotateY‘:           case ‘translateZ‘:               setCss3(obj, attr, value);               break;           case ‘width‘:           case ‘height‘:           case ‘paddingLeft‘:           case ‘paddingTop‘:           case ‘paddingRight‘:           case ‘paddingBottom‘:               value = Math.max(value, 0);           case ‘left‘:           case ‘top‘:           case ‘marginLeft‘:           case ‘marginTop‘:           case ‘marginRight‘:           case ‘marginBottom‘:               obj.style[attr] = value + ‘px‘;               break;           case ‘opacity‘:               obj.style.filter = "alpha(opacity:" + value + ")";               obj.style.opacity = value / 100;               break;           default:               obj.style[attr] = value;       }   }   return function(attr_in, value_in) {       css(obj, attr_in, value_in)   };}function setCss3(obj, attr, value) {   var sTr = "";   var sVal = "";   var arr = ["Webkit", "Moz", "O", "ms", ""];   if (!obj["$Transform"]) {       obj["$Transform"] = {};   }   obj["$Transform"][attr] = parseInt(value);   for (sTr in obj["$Transform"]) {       switch (sTr) {           case ‘scale‘:               sVal += sTr + "(" + (obj["$Transform"][sTr] / 100) + ") ";               break;           case ‘rotate‘:           case ‘rotateY‘:               sVal += sTr + "(" + (obj["$Transform"][sTr]) + "deg) ";               break;           case ‘translateZ‘:               sVal += sTr + "(" + (obj["$Transform"][sTr]) + "px) ";               break;       }   }   for (var i = 0; i < arr.length; i++) {       obj.style[arr[i] + "Transform"] = sVal;   }}

 

[f]添加cssTransform屬性的方法