封裝transform函數(設置和獲取transform的屬性和屬性值)

(function (w) {    /**     * 設置或者獲取元素的transform屬性值     * @param node  要設置的元素     * @param param  變換屬性: translate\scale\rotate....     * @param value  變換屬性的值 (可選) 若是指定了,設置;沒有指定,獲取;     */    function transformCss(node, param, value) {        //若是第一次設置元素        if (node.transformData === undefined) {            //給元素添加一個屬性,用來保存元素的transform設置            node.transformData = {};        }        if (arguments.length === 3) {            //設置 transform 屬性            //把transform屬性添加到 tansformData裏面            node.transformData[param] = value;            //設置transform值的字符串            var transformStr = '';            //遍歷 transformData            for (var i in node.transformData) {                switch (i) {                    case 'translate':                    case 'translateX':                    case 'translateY':                        transformStr += i+'('+node.transformData[i]+'px) ';                        break;                    case 'scale':                    case 'scaleX':                    case 'scaleY':                        transformStr += i+'('+node.transformData[i]+') ';                        break;                    case 'rotate':                    case 'skew':                    case 'skewX':                    case 'skewY':                        transformStr += i+'('+node.transformData[i]+'deg) ';                        break;                }                //設置css樣式                node.style.transform = transformStr;            }        } else if (arguments.length === 2) {            //獲取transform屬性值            //根據參數從trnasformData獲取            var result = node.transformData[param];            //若是transformData沒有,取默認值            if (result === undefined) {                if (param === 'scale' || param === 'scaleX' || param === 'scaleY') {                    result = 1;                } else {                    result = 0;                }            }            //把結果返回            return result;        }    }    //暴露    w.transformCss = transformCss;})(window);
相關文章
相關標籤/搜索