https://www.muzik-online.com/js/clip.js

1/**
2 * @author alexander.farkas
3 * @version 1.0
4 */
5(function($){
6	
7	if(!document.defaultView || !document.defaultView.getComputedStyle){ // IE6-IE8 workaround
8		var oldCurCSS = $.curCSS;
9		$.curCSS = function(elem, name, force){
10			var curStyle = elem.currentStyle, ret;
11			if(name === 'font-size'){
12				name = 'fontSize';
13			}
14			if((name !== 'clip' && name !== 'fontSize') || !curStyle){
15				return oldCurCSS.apply(this, arguments);
16			}
17			var style = elem.style;
18			if ( !force && style ){
19				ret = style[ name ];
20			}
21			if(name === 'clip'){
22				ret = ret || 'rect('+ (curStyle.clipTop || 'auto') +' '+ (curStyle.clipRight || 'auto') +' '+ (curStyle.clipBottom || 'auto') +' '+ (curStyle.clipLeft || 'auto') +')';
23			} else {
24				ret = ret || curStyle.fontSize;
25				if(!(/px/.test(ret))){
26					// Remember the original values
27					var width = style.width, rsWidth = elem.runtimeStyle.width;
28	
29					// Put in the new values to get a computed value out
30					elem.runtimeStyle.width = elem.currentStyle.width;
31					style.width = '100em';
32					ret = style.pixelWidth / 100 + "px";
33					// Revert the changed values
34					style.width = width;
35					elem.runtimeStyle.width = rsWidth;
36				}
37			}
38			return ret;
39		};
40	}
41})(jQuery);
42
43(function($){
44	var calcClipAuto = [
45						function(){
46							return 0;
47						},
48						function(elem){
49							return $(elem).outerWidth();
50						},
51						function(elem){
52							return $(elem).outerHeight();
53						},
54						function(elem){
55							return 0;
56						}
57					],
58					
59					calcNumClip = function(prop, elem){
60						return ((/em/.test(prop))) ? 
61								(parseFloat($.curCSS(elem, 'fontSize'), 10) || 1) * (parseFloat(prop, 10) || 0) :
62								(parseInt(prop, 10) || 0)
63						;
64					}
65	;
66	
67	var calcClip = function(css, fx, isEnd){
68			var ret 	= [];
69			if(css === 'auto'){
70				css = 'rect(auto auto auto auto)';
71			}
72			
73			css = css.replace(/rect\(|\)/g, '').split(/,\s*|\s/);
74			if(isEnd){
75				fx.endClipStyle = 'rect('+ css.join(' ') +')';
76			}
77			for(var i = 0; i < css.length; i++){
78				ret[i] = (css[i] !== 'auto') ? 
79							calcNumClip(css[i], fx.elem) : 
80							calcClipAuto[i](fx.elem);
81			}
82			
83			return ret;
84		};
85	
86	jQuery.fx.step.clip = function(fx){
87		if (!fx.clipInit) {
88			
89			fx.start = calcClip($.curCSS(fx.elem, 'clip'), fx);
90			fx.end = calcClip(fx.end, fx, true);
91			fx.elmStyle = fx.elem.style;
92			fx.clipInit = true;
93		}
94		
95		fx.elmStyle.clip = 'rect('+ ( fx.pos * (fx.end[0] - fx.start[0]) + fx.start[0] ) +'px '+ (fx.pos * (fx.end[1] - fx.start[1]) + fx.start[1]) +'px '+ (fx.pos * (fx.end[2] - fx.start[2]) + fx.start[2]) +'px '+ (fx.pos * (fx.end[3] - fx.start[3]) + fx.start[3]) +'px)';
96		
97		if(fx.pos === 1 && fx.endClipStyle){
98			fx.elmStyle.clip = fx.endClipStyle;
99		}
100	};
101})(jQuery);