Mass framework CSS Module

This actually contains two files. In ie9, it fully supports the W3C API for precisely retrieving styles, so you do not need to use currentstyle and runtimestyle, therefore, compatibility with legacy IE is stored in a single JS file.

CSS. js

// ================================================ ====/// Style operation module by situ zhengmei 2011.8.23 // ====================== ================= (function (global, doc) {var dom = global [Doc. URL. replace (/(#. + | \ W)/g, '')], deps = Global. getcomputedstyle? "Node": "node, css_ie"; Dom. define ("CSS", deps, function () {Dom. log ("loaded CSS module") var cssfloat = dom.support.css float? 'Cssfloat': 'stylefloat', RCAP =/-([A-Z])/g, capfn = function ($0, $1) {return $1. touppercase () ;}, adapter = dom.css adapter ||{}; function csscache (name) {return csscache [name] | (csscache [name] = Name = 'float '? Cssfloat: Name. replace (RCAP, capfn);} Dom. mix (DOM, {// http://www.cnblogs.com/rubylouvre/archive/2011/03/28/1998223.html cssname: function (name) {var prefixes = ['', '-MS-', '-moz-', '-WebKit -', '-khtml-', '-o-', 'Ms-'] dom.css name = function (name, target, test) {target = target | document.doc umentelement. style; For (VAR I = 0, L = prefixes. length; I
 css_ie.js 
(Function (global, DOC) {var dom = global [Doc. URL. replace (/(#. + | \ W)/g, '')]; Dom. define ("css_ie", function () {Dom. log ("css_ie module loaded") var adapter = dom.css adapter = {}; // ================================================= ================= var ropacity =/opacity = ([^)] *)/I, Ralpha =/Alpha \ ([^)] * \)/I, rnumpx =/^ -? \ D + (?: Px )? $/I, rnum =/^ -? \ D/; adapter ["opacity: Get"] = function (node, OP) {// This is the fastest way to get the IE transparent value, no need to use regular expressions! If (node. filters. alpha) {op = node. filters. alpha. opacity;} else if (node. filters ["DXImageTransform. microsoft. alpha "]) {op = node. filters ["DXImageTransform. microsoft. alpha "]. opacity} else {op = (node. currentstyle. filter | "opacity = 100 "). match (ropacity) [1];} return (~~ OP)/100;} adapter ["opacity: Set"] = function (node, name, value) {var currentstyle = node. currentstyle, style = node. style; If (! Currentstyle. haslayout) style. Zoom = 1; // get the element haslayout value = (value> 0.999 )? 1: (Value
 related tests: 
Dom. define ("test/CSS", "spec, CSS", function () {Dom. addtestmodule ("style operation module-CSS", {"dom.fn.css": function () {var El = dom ('<Div id = "test-Div"' + 'style = "padding-left: 2pt; '+ 'background: transparent; '+ 'font-size: 16px;' + 'float: Left; '+ 'border: 5px solid RGB (0, 0 ); "> CSS test </div> '). appendto ("body"); El = dom ("# Test-Div") expect(el.css ('float ')). eq ('left'); // 1 expect(el.css ('position ')). eq ('static '); // 2 expect(el.css ('backgroundcolor ')). match (function (VAL) {return val = "rgba (0, 0, 0, 0)" | val = "Transparent "}); // 3 expect(el.css ('backgroundposition ')). eq ("0% 0%"); // 4 expect(el.css ('backgroundpositionx ')). eq ('0% '); // 5 expect(el.css ('fontsize ')). eq ('16px '); // 6 expect(el.css ('border-right-width ')). eq ('5px '); // 7 var matchfn = function (VAL) {val = parsefloat (VAL) return Val> = 2 & Val <= 3} expect(el.css ('paddingleft ')). match (matchfn); // 8 expect(el.css ('padding-left ')). match (matchfn); // 9 expect(el.css ('padding-right ')). eq ('0px '); // 10 expect(el.css ('opacity ')). eq ('1'); // 11 // do not add DOM nodes, ie9, Firefox returns auto by computedstyle // IE7, 8 returns a negative number, offsetheight returns 0 // alert (ELEM. currentstyle. height); = auto expect(parseint(el.css ('height '))). match (function (VAL) {val = parsefloat (VAL) return Val >=18 & Val <= 20}); // 12 el.css ('float ', 'right'); expect(el.css ('float ')). eq ('right'); // 13 el.css ('font-size', '000000'); expect(el.css ('font-size ')). eq ("16px"); // 14 el.css ('opacity ', '0. 2 '); expect(el.css ('opacity ')). match (function (VAL) {val = parsefloat (VAL); Return Val >=0.2 & Val <0.21 ;}); el.css ('border ', '2px dashed red'); expect(el.css ('borderleftwidth ')). eq ('2px '); // 16 el. remove ();}});});
The usage is consistent with jquery. The reader and writer are combined into one and set all get first.
 
 
Dom. require ("CSS", function () {var A = dom ('<Div style = "width: 100px; opacity: 0.7; filter: alpha (opacity = 50 ), blur (add = ture, direction = 135, strength = 200) "> '); Dom. log (a.css ("opacity") // ie9, FF is 0.7; IE6-8 is 0.5 });