/
css.js
590 lines (574 loc) · 26.2 KB
/
css.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
//=========================================
// 样式操作模块 by 司徒正美
//=========================================
$.define( "css", !!top.getComputedStyle ? "node" : "node,css_fix" , function(){
//$.log( "已加载css模块" );
var adapter = $.cssAdapter = $.cssAdapter || {}
var rrelNum = /^([\-+])=([\-+.\de]+)/
var rnumnonpx = /^-?(?:\d*\.)?\d+(?!px)[^\d\s]+$/i
$.implement({
css : function( name, value , neo){
if(typeof name === "string"){
neo = $.cssName(name) || name;
}
return $.access( this, name, value, $.css, neo || this );
}
});
$.mix({
scrollbarWidth: function (){
if( $.scrollbarWidth.ret ){
return $.scrollbarWidth.ret
}
var test = $('<div style="width: 100px;height: 100px;overflow: scroll;position: absolute;top: -9999px;"/>').appendTo("body");
var ret = test[0].offsetWidth - test[0].clientWidth;
test.remove();
return $.scrollbarWidth.ret = ret;
},
//这里的属性不需要自行添加px
cssNumber: $.oneObject("fontSizeAdjust,fontWeight,lineHeight,opacity,orphans,widows,zIndex,zoom,rotate"),
css: function( node, name, value){
if(node.style){//注意string经过call之后，变成String伪对象，不能简单用typeof来检测
name = $.type(this, "String") ? this : $.cssName( name ) || name;
if( value === void 0){ //取值
return (adapter[ name+":get" ] || adapter[ "_default:get" ])( node, name );
}else {//设值
var temp;
if ( typeof value === "string" && (temp = rrelNum.exec( value )) ) {
value = ( temp[1] + 1) * temp[2] + parseFloat( $.css( node, name, void 0) );
}
if ( isFinite( value ) && !$.cssNumber[ name ] ) {
value += "px";
}
(adapter[name+":set"] || adapter[ "_default:set" ])( node, name, value );
}
}
}
});
//IE9 FF等支持getComputedStyle
$.mix(adapter, {
"_default:set" :function( node, name, value){
node.style[ name ] = value;
}
},false);
//有关单位转换的 http://heygrady.com/blog/2011/12/21/length-and-angle-unit-conversion-in-javascript/
if ( document.defaultView && document.defaultView.getComputedStyle ) {
adapter[ "_default:get" ] = function( node, name ) {
var ret, defaultView, computedStyle;
if ( !(defaultView = node.ownerDocument.defaultView) ) {
return undefined;
}
// var underscored = name == "cssFloat" ? "float" :
// name.replace( /([A-Z]|^ms)/g, "-$1" ).toLowerCase(),
var rmargin = /^margin/, style = node.style ;
if ( (computedStyle = defaultView.getComputedStyle( node, null )) ) {
ret = computedStyle[name] //.getPropertyValue( underscored );
if ( ret === "" && !$.contains( node.ownerDocument, node ) ) {
ret = style[name];//如果还没有加入DOM树，则取内联样式
}
}
// A tribute to the "awesome hack by Dean Edwards"
// WebKit uses "computed value (percentage if specified)" instead of "used value" for margins
// which is against the CSSOM draft spec: http://dev.w3.org/csswg/cssom/#resolved-values
if ( !$.support.cssPercentedMargin && computedStyle && rmargin.test( name ) && rnumnonpx.test( ret ) ) {
var width = style.width;
style.width = ret;
ret = computedStyle.width;
style.width = width;
}
return ret === "" ? "auto" : ret;
};
}
//http://extremelysatisfactorytotalitarianism.com/blog/?p=1002
//http://someguynameddylan.com/lab/transform-origin-in-internet-explorer.php
//优化HTML5应用的体验细节，例如全屏的处理与支持，横屏的响应，图形缩放的流畅性和不失真，点触的响应与拖曳，Websocket的完善
//关于JavaScript中计算精度丢失的问题 http://rockyee.iteye.com/blog/891538
function toFixed(d){
return d > -0.0000001 && d < 0.0000001 ? 0 : /e/.test(d+"") ? d.toFixed(7) : d;
}
function toFloat(d, x){
return isFinite(d) ? d: parseFloat(d) || x
}
//http://zh.wikipedia.org/wiki/%E7%9F%A9%E9%98%B5
//http://help.dottoro.com/lcebdggm.php
var Matrix2D = $.factory({
init: function(){
this.set.apply(this, arguments);
},
cross: function(a, b, c, d, tx, ty) {
var a1 = this.a;
var b1 = this.b;
var c1 = this.c;
var d1 = this.d;
this.a = toFixed(a*a1+b*c1);
this.b = toFixed(a*b1+b*d1);
this.c = toFixed(c*a1+d*c1);
this.d = toFixed(c*b1+d*d1);
this.tx = toFixed(tx*a1+ty*c1+this.tx);
this.ty = toFixed(tx*b1+ty*d1+this.ty);
return this;
},
rotate: function( radian ) {
var cos = Math.cos(radian);
var sin = Math.sin(radian);
return this.cross(cos, sin, -sin, cos, 0, 0)
},
skew: function(sx, sy) {
return this.cross(1, Math.tan( sy ), Math.tan( sx ), 1, 0, 0);
},
skewX: function(radian){
return this.skew(radian, 0);
},
skewY: function(radian){
return this.skew(0, radian);
},
scale: function(x, y) {
return this.cross( toFloat(x, 1) ,0, 0, toFloat(y, 1), 0, 0)
},
scaleX: function(x){
return this.scale(x ,1);
},
scaleY: function(y){
return this.scale(1 ,y);
},
translate : function(x, y) {
return this.cross(1, 0, 0, 1, toFloat(x, 0), toFloat(y, 0))
},
translateX: function(x) {
return this.translate(x, 0);
},
translateY: function(y) {
return this.translate(0, y);
},
toString: function(){
return "matrix("+this.get()+")";
},
get: function(){
return [this.a,this.b,this.c,this.d,this.tx,this.ty];
},
set: function(a, b, c, d, tx, ty){
this.a = a * 1;
this.b = b * 1 || 0;
this.c = c * 1 || 0;
this.d = d * 1;
this.tx = tx * 1 || 0;
this.ty = ty * 1 || 0;
return this;
},
matrix:function(a, b, c, d, tx, ty){
return this.cross(a, b, c, d, toFloat(tx, 0), toFloat(ty, 0))
},
decompose: function() {
//分解原始数值,返回一个包含translateX,translateY,scale,skewX,rotate的对象
//https://github.com/louisremi/jquery.transform.js/blob/master/jquery.transform2d.js
//http://http://mxr.mozilla.org/mozilla-central/source/layout/style/nsStyleAnimation.cpp
var scaleX, scaleY, skew, A = this.a, B = this.b,C = this.c,D = this.d ;
if ( A * D - B * C ) {
// step (3)
scaleX = Math.sqrt( A * A + B * B );
A /= scaleX;
B /= scaleX;
// step (4)
skew = A * C + B * D;
C -= A * skew;
D -= B * skew;
// step (5)
scaleY = Math.sqrt( C * C + D * D );
C /= scaleY;
D /= scaleY;
skew /= scaleY;
// step (6)
if ( A * D < B * C ) {
A = -A;
B = -B;
skew = -skew;
scaleX = -scaleX;
}
} else {
scaleX = scaleY = skew = 0;
}
return [
["translate", [+this.tx, +this.ty]],
["rotate", Math.atan2(B, A)],
["skewX", Math.atan(skew)],
["scale", [scaleX, scaleY]]]
}
});
$.Matrix2D = Matrix2D
var getter = $.cssAdapter["_default:get"], RECT = "getBoundingClientRect",
//支持情况 ff3.5 chrome ie9 pp6 opara10.5 safari3.1
cssTransfrom = $.support.transform = $.cssName("transform");
if( cssTransfrom ){
adapter[cssTransfrom + ":set"] = function(node, name, value){
if(value.indexOf("matrix")!== -1 && cssTransfrom === "MozTransform"){
value = value.replace(/([\d.-]+)\s*,\s*([\d.-]+)\s*\)/,"$1px, $2px)")
}
node.style[name] = value;
var matrix = $._data( node, "matrix" ) || new Matrix2D();
matrix.set.apply(matrix, getter(node, cssTransfrom).match(/[-+.e\d]+/g).map(function(d){
return toFixed(d*1)
}));
$._data(node, "matrix", matrix );
}
}
//http://granular.cs.umu.se/browserphysics/?cat=7
//========================= 处理 user-select =========================
//https://developer.mozilla.org/en/CSS/-moz-user-select
//http://www.w3.org/TR/2000/WD-css3-userint-20000216#user-select
//具体支持情况可见下面网址
//http://help.dottoro.com/lcrlukea.php
var userSelect = $.cssName("userSelect");
if( userSelect ){
adapter[ userSelect+":set" ] = function( node, name, value ) {
return node.style[ name ] = value;
};
}
adapter[ "zIndex:get" ] = function( node, name, value, position ) {
while ( node.nodeType !== 9 ) {
//即使元素定位了，但如果zindex设置为"aaa"这样的无效值，浏览器都会返回auto，如果没有指定zindex值，IE会返回数字0，其他返回auto
position = $.css(node, "position" );
if ( position === "absolute" || position === "relative" || position === "fixed" ) {
// <div style="z-index: -10;"><div style="z-index: 0;"></div></div>
value = parseInt( adapter[ "_default:get" ](node,"zIndex"), 10 );
if ( !isNaN( value ) && value !== 0 ) {
return value;
}
}
node = node.parentNode;
}
return 0;
}
//http://extremelysatisfactorytotalitarianism.com/blog/?p=922
//http://someguynameddylan.com/lab/transform-origin-in-internet-explorer.php#matrix-anim-class
//========================= 处理 width height =========================
/**框架一般处在低层应用平台和高层业务逻辑之间的中间层。
// http://www.quirksmode.org/dom/w3c_cssom.html#t40
// clientWidth = node.style.width + padding
// https://developer.mozilla.org/en/DOM/element.clientWidth
// offsetWidth = node.style.width + padding + border
// https://developer.mozilla.org/en/DOM/element.offsetWidth
// getBoundingClientRect = node.style.width + padding + border
// https://developer.mozilla.org/en/DOM/element.getBoundingClientRect
// [CSS2.1 盒子模型] http://www.w3.org/TR/CSS2/box.html
// B-------border----------+ -> border
// | |
// | P----padding----+ | -> padding
// | | | |
// | | C-content-+ | | -> content
// | | | | | |
// | | | | | |
// | | +---------+ | |
// | | | |
// | +---------------+ |
// | |
// +-----------------------+
// B = event.offsetX/Y in WebKit
// event.layerX/Y in Gecko
// P = event.offsetX/Y in IE6 ~ IE8
// C = event.offsetX/Y in Opera
*/
var cssPair = {
Width:['Left', 'Right'],
Height:['Top', 'Bottom']
}
var cssShow = {
position: "absolute",
visibility: "hidden",
display: "block"
}
var showHidden = function(node, array){
if( node && node.nodeType == 1 && !node.offsetWidth ){
var obj = {
node: node
}
for (var name in cssShow ) {
obj[ name ] = node.style[ name ];
node.style[ name ] = cssShow[ name ];
}
array.push( obj );
if(!node.offsetWidth){//如果设置了offsetWidth还是为零，说明父节点也是隐藏元素，继续往上递归
showHidden(node.parentNode, array)
}
}
}
$.support.boxSizing = $.cssName( "boxSizing")
function getWH( node, name, extra ) {//注意 name是首字母大写
var getter = $.cssAdapter["_default:get"], which = cssPair[name], hidden = [];
showHidden( node, hidden );
var val = node["offset" + name]
//if($.support.boxSizing && $.css(node, "boxSizing" ) === "border-box" && extra == 0 ){ return val; }
//innerWidth = paddingWidth outerWidth = borderWidth, width = contentWidth
which.forEach(function(direction){
if(extra < 1)
val -= parseFloat(getter(node, 'padding' + direction)) || 0;
if(extra < 2)
val -= parseFloat(getter(node, 'border' + direction + 'Width')) || 0;
if(extra === 3){
val += parseFloat(getter(node, 'margin' + direction )) || 0;
}
});
for(var i = 0, obj; obj = hidden[i++];){
node = obj.node;
for ( name in obj ) {
if(typeof obj[ name ] == "string"){
node.style[ name ] = obj[ name ];
}
}
}
return val;
};
//生成width, height, innerWidth, innerHeight, outerWidth, outerHeight这六种原型方法
"Height,Width".replace( $.rword, function( name ) {
var lower = name.toLowerCase(),
clientProp = "client" + name,
scrollProp = "scroll" + name,
offsetProp = "offset" + name;
$.cssAdapter[ lower+":get" ] = function( node ){
return getWH( node, name, 0 ) + "px";//添加相应适配器
}
"inner_1,b_0,outer_2".replace(/(\w+)_(\d)/g,function(a, b, num){
var method = b == "b" ? lower : b + name;
$.fn[ method ] = function( value ) {
num = b == "outer" && value === true ? 3 : num;
return $.access( this, num, value, function( target, num, size ) {
if ( $.type( target,"Window" ) ) {//取得窗口尺寸
return target.document.documentElement[ clientProp ];
}
if ( target.nodeType === 9 ) {//取得页面尺寸
var doc = target.documentElement;
//IE6/IE7下，<html>的box-sizing默认值本就是border-box
if ( doc[ clientProp ] >= doc[ scrollProp ] ) {
return doc[ clientProp ];
}
return Math.max(
target.body[ scrollProp ], doc[ scrollProp ],
target.body[ offsetProp ], doc[ offsetProp ],
doc[ clientProp ]
);
} else if ( size === void 0 ) {
return getWH( target, name, num )
} else {
$.log(size)
return num > 0 ? this : $.css( target, lower, size );
}
}, this)
}
})
});
//=======================================================
//获取body的offset
function getBodyOffsetNoMargin(){
var el = document.body, ret = parseFloat($.css(el,"marginTop"))!== el.offsetTop;
function getBodyOffsetNoMargin(){
return ret;//一次之后的执行结果
}
return ret;//第一次执行结果
}
function setOffset(elem, options){
if(elem && elem.nodeType == 1 ){
var position = $.css( elem, "position" );
// set position first, in-case top/left are set even on static elem
if ( position === "static" ) {
elem.style.position = "relative";
}
var curElem = $( elem ),
curOffset = curElem.offset(),
curCSSTop = $.css( elem, "top" ),
curCSSLeft = $.css( elem, "left" ),
calculatePosition = ( position === "absolute" || position === "fixed" ) && [curCSSTop, curCSSLeft].indexOf("auto") > -1,
props = {}, curPosition = {}, curTop, curLeft;
// need to be able to calculate position if either top or left is auto and position is either absolute or fixed
if ( calculatePosition ) {
curPosition = curElem.position();
curTop = curPosition.top;
curLeft = curPosition.left;
} else {
curTop = parseFloat( curCSSTop ) || 0;
curLeft = parseFloat( curCSSLeft ) || 0;
}
if ( options.top != null ) {
props.top = ( options.top - curOffset.top ) + curTop;
}
if ( options.left != null ) {
props.left = ( options.left - curOffset.left ) + curLeft;
}
curElem.css( props );
}
}
$.fn.offset = function(options){//取得第一个元素位于页面的坐标
if ( arguments.length ) {
return (!options || ( !isFinite(options.top) && !isFinite(options.left) ) ) ? this :
this.each(function() {
setOffset( this, options );
});
}
var node = this[0], owner = node && node.ownerDocument, pos = {
left:0,
top:0
};
if ( !node || !owner ) {
return pos;
}
if( node.tagName === "BODY" ){
pos.top = node.offsetTop;
pos.left = body.offsetLeft;
//http://hkom.blog1.fc2.com/?mode=m&no=750 body的偏移量是不包含margin的
if(getBodyOffsetNoMargin()){
pos.top += parseFloat( getter(node, "marginTop") ) || 0;
pos.left += parseFloat( getter(node, "marginLeft") ) || 0;
}
return pos;
}else if ( $.html[ RECT ]) { //如果支持getBoundingClientRect
//我们可以通过getBoundingClientRect来获得元素相对于client的rect.
//http://msdn.microsoft.com/en-us/library/ms536433.aspx
var box = node[ RECT ](),win = getWindow(owner),
root = owner.documentElement,body = owner.body,
clientTop = root.clientTop || body.clientTop || 0,
clientLeft = root.clientLeft || body.clientLeft || 0,
scrollTop = win.pageYOffset || $.support.boxModel && root.scrollTop || body.scrollTop,
scrollLeft = win.pageXOffset || $.support.boxModel && root.scrollLeft || body.scrollLeft;
// 加上document的scroll的部分尺寸到left,top中。
// IE一些版本中会自动为HTML元素加上2px的border，我们需要去掉它
// http://msdn.microsoft.com/en-us/library/ms533564(VS.85).aspx
pos.top = box.top + scrollTop - clientTop,
pos.left = box.left + scrollLeft - clientLeft;
}
return pos;
}
"show,hide".replace($.rword, function(method){
$.fn[ method ] = function(){
return this.each(function(){
if(this.style){
this.style.display = method == "show" ? "" : "hide"
}
})
}
})
var rroot = /^(?:body|html)$/i;
$.implement({
position: function() {//取得元素相对于其offsetParent的坐标
var ret = this.offset(), node = this[0];
if ( node && node.nodeType ===1 ) {
var offsetParent = this.offsetParent(),
parentOffset = rroot.test(offsetParent[0].nodeName) ? {
top:0,
left:0
} : offsetParent.offset();
ret.top -= parseFloat( getter(node, "marginTop") ) || 0;
ret.left -= parseFloat( getter(node, "marginLeft") ) || 0;
parentOffset.top += parseFloat( getter(offsetParent[0], "borderTopWidth") ) || 0;
parentOffset.left += parseFloat( getter(offsetParent[0], "borderLeftWidth") ) || 0;
ret.top -= parentOffset.top;
ret.left -= parentOffset.left
}
return ret;
},
offsetParent: function() {
return this.map(function() {
var offsetParent = this.offsetParent || document.body;
while ( offsetParent && (!rroot.test(offsetParent.nodeName) && getter(offsetParent, "position") === "static") ) {
offsetParent = offsetParent.offsetParent;
}
return offsetParent;
});
},
scrollParent: function() {
var scrollParent;
if ((window.VBArray && (/(static|relative)/).test(this.css('position'))) || (/absolute/).test(this.css('position'))) {
scrollParent = this.parents().filter(function() {
return (/(relative|absolute|fixed)/).test($.css(this,'position')) && (/(auto|scroll)/).test($.css(this,'overflow')+$.css(this,'overflow-y')+$.css(this,'overflow-x'));
}).eq(0);
} else {
scrollParent = this.parents().filter(function() {
return (/(auto|scroll)/).test($.css(this,'overflow')+$.css(this,'overflow-y')+$.css(this,'overflow-x'));
}).eq(0);
}
return (/fixed/).test(this.css('position')) || !scrollParent.length ? $(document) : scrollParent;
}
});
"Left,Top".replace( $.rword, function( name ) {
adapter[ name.toLowerCase() +":get"] = function(node){//添加top, left到cssAdapter
var val = getter(node, name.toLowerCase()), offset;
// 1. 当没有设置 style.left 时，getComputedStyle 在不同浏览器下，返回值不同
// 比如：firefox 返回 0, webkit/ie 返回 auto
// 2. style.left 设置为百分比时，返回值为百分比
// 对于第一种情况，如果是 relative 元素，值为 0. 如果是 absolute 元素，值为 offsetLeft - marginLeft
// 对于第二种情况，大部分类库都未做处理，属于“明之而不 fix”的保留 bug
if(val === "auto"){
val = 0;
if(/absolute|fixed/.test(getter(node,"position"))){
offset = node["offset"+name ];
// old-ie 下，elem.offsetLeft 包含 offsetParent 的 border 宽度，需要减掉
if (node.uniqueID && document.documentMode < 9 || window.opera) {
// 类似 offset ie 下的边框处理
// 如果 offsetParent 为 html ，需要减去默认 2 px == documentElement.clientTop
// 否则减去 borderTop 其实也是 clientTop
// http://msdn.microsoft.com/en-us/library/aa752288%28v=vs.85%29.aspx
// ie<9 注意有时候 elem.offsetParent 为 null ...
// 比如 DOM.append(DOM.create("<div class='position:absolute'></div>"),document.body)
offset -= node.offsetParent && node.offsetParent['client' + name] || 0;
}
val = offset - (parseInt(getter(node, 'margin' + name),10) || 0) +"px";
}
}
return val
};
var method = "scroll" + name;
$.fn[ method ] = function( val ) {
var node, win, t = name == "Top";
if ( val === void 0 ) {
node = this[ 0 ];
if ( !node ) {
return null;
}
win = getWindow( node );
// Return the scroll offset
return win ? ("pageXOffset" in win) ? win[ t ? "pageYOffset" : "pageXOffset" ] :
$.support.boxModel && win.document.documentElement[ method ] ||
win.document.body[ method ] :
node[ method ];
}
// Set the scroll offset
return this.each(function() {
win = getWindow( this );
if ( win ) {
win.scrollTo(
!t ? val : $( win ).scrollLeft(),
t ? val : $( win ).scrollTop()
);
} else {
this[ method ] = val;
}
});
};
});
var pseudoAdapter = window.VBArray && $.query && $.query.pseudoAdapter
if(pseudoAdapter){
pseudoAdapter.hidden = function( el ) {
return el.type === "hidden" || $.css( el, "display") === "none" ;
}
}
function getWindow( node ) {
return $.type(node,"Window") ? node : node.nodeType === 9 ? node.defaultView || node.parentWindow : false;
} ;
});
/**
2011.9.5将cssName改为隋性函数,修正msTransform Bug
2011.9.19 添加$.fn.offset width height innerWidth innerHeight outerWidth outerHeight scrollTop scrollLeft offset position
2011.9.20 v2
2011.10.10 重构position offset保持这两者行为一致，
2011.10.15 Fix $.css BUG 添加transform rotate API
2011.10.21 修正width height的BUG
2011.11.10 添加top,left到cssAdapter
2011.11.21 _all2deg,_all2rad,_toMatrixArray,_toMatrixObject放到命名空间之下，方便调用，简化transform逻辑
2012.3.2 getWH现在能获取多重隐藏元素的高宽了
2012.4.15 对zIndex进行适配,对$.css进行元素节点检测
2012.4.16 重构showHidden
2012.5.9 $.Matrix2D支持matrix方法，去掉rotate方法 css 升级到v3
2012.5.10 FIX toFloat BUG
2012.5.26 重构$.fn.width, $.fn.height,$.fn.innerWidth, $.fn.innerHeight, $.fn.outerWidth, $.fn.outerHeight
//本地模拟多个域名http://hi.baidu.com/fmqc/blog/item/07bdeefa75f2e0cbb58f3100.html
//z-index的最大值（各浏览器）http://hi.baidu.com/flondon/item/a64550ba98a9d3ef4ec7fd77
http://joeist.com/2012/06/what-is-the-highest-possible-z-index-value/ 这里有更全面的测试
http://boobstagram.fr/archive
ccs3 网站 http://hakim.se/experiments
*/