| 1 | /* |
| 2 | * jQuery Color Animations |
| 3 | * Copyright 2007 John Resig |
| 4 | * Released under the MIT and GPL licenses. |
| 5 | */ |
| 6 | |
| 7 | (function(jQuery){ |
| 8 | |
| 9 | // We override the animation for all of these color styles |
| 10 | jQuery.each(['backgroundColor', 'borderBottomColor', 'borderLeftColor', 'borderRightColor', 'borderTopColor', 'color', 'outlineColor'], function(i,attr){ |
| 11 | jQuery.fx.step[attr] = function(fx){ |
| 12 | if ( fx.state == 0 ) { |
| 13 | fx.start = getColor( fx.elem, attr ); |
| 14 | fx.end = getRGB( fx.end ); |
| 15 | } |
| 16 | |
| 17 | fx.elem.style[attr] = "rgb(" + [ |
| 18 | Math.max(Math.min( parseInt((fx.pos * (fx.end[0] - fx.start[0])) + fx.start[0]), 255), 0), |
| 19 | Math.max(Math.min( parseInt((fx.pos * (fx.end[1] - fx.start[1])) + fx.start[1]), 255), 0), |
| 20 | Math.max(Math.min( parseInt((fx.pos * (fx.end[2] - fx.start[2])) + fx.start[2]), 255), 0) |
| 21 | ].join(",") + ")"; |
| 22 | } |
| 23 | }); |
| 24 | |
| 25 | // Color Conversion functions from highlightFade |
| 26 | // By Blair Mitchelmore |
| 27 | // http://jquery.offput.ca/highlightFade/ |
| 28 | |
| 29 | // Parse strings looking for color tuples [255,255,255] |
| 30 | function getRGB(color) { |
| 31 | var result; |
| 32 | |
| 33 | // Check if we're already dealing with an array of colors |
| 34 | if ( color && color.constructor == Array && color.length == 3 ) |
| 35 | return color; |
| 36 | |
| 37 | // Look for rgb(num,num,num) |
| 38 | if (result = /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/.exec(color)) |
| 39 | return [parseInt(result[1]), parseInt(result[2]), parseInt(result[3])]; |
| 40 | |
| 41 | // Look for rgb(num%,num%,num%) |
| 42 | if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/.exec(color)) |
| 43 | return [parseFloat(result[1])*2.55, parseFloat(result[2])*2.55, parseFloat(result[3])*2.55]; |
| 44 | |
| 45 | // Look for #a0b1c2 |
| 46 | if (result = /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/.exec(color)) |
| 47 | return [parseInt(result[1],16), parseInt(result[2],16), parseInt(result[3],16)]; |
| 48 | |
| 49 | // Look for #fff |
| 50 | if (result = /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/.exec(color)) |
| 51 | return [parseInt(result[1]+result[1],16), parseInt(result[2]+result[2],16), parseInt(result[3]+result[3],16)]; |
| 52 | |
| 53 | // Otherwise, we're most likely dealing with a named color |
| 54 | return colors[jQuery.trim(color).toLowerCase()]; |
| 55 | } |
| 56 | |
| 57 | function getColor(elem, attr) { |
| 58 | var color; |
| 59 | |
| 60 | do { |
| 61 | color = jQuery.curCSS(elem, attr); |
| 62 | |
| 63 | // Keep going until we find an element that has color, or we hit the body |
| 64 | if ( color != '' && color != 'transparent' || jQuery.nodeName(elem, "body") ) |
| 65 | break; |
| 66 | |
| 67 | attr = "backgroundColor"; |
| 68 | } while ( elem = elem.parentNode ); |
| 69 | |
| 70 | return getRGB(color); |
| 71 | }; |
| 72 | |
| 73 | // Some named colors to work with |
| 74 | // From Interface by Stefan Petre |
| 75 | // http://interface.eyecon.ro/ |
| 76 | |
| 77 | var colors = { |
| 78 | aqua:[0,255,255], |
| 79 | azure:[240,255,255], |
| 80 | beige:[245,245,220], |
| 81 | black:[0,0,0], |
| 82 | blue:[0,0,255], |
| 83 | brown:[165,42,42], |
| 84 | cyan:[0,255,255], |
| 85 | darkblue:[0,0,139], |
| 86 | darkcyan:[0,139,139], |
| 87 | darkgrey:[169,169,169], |
| 88 | darkgreen:[0,100,0], |
| 89 | darkkhaki:[189,183,107], |
| 90 | darkmagenta:[139,0,139], |
| 91 | darkolivegreen:[85,107,47], |
| 92 | darkorange:[255,140,0], |
| 93 | darkorchid:[153,50,204], |
| 94 | darkred:[139,0,0], |
| 95 | darksalmon:[233,150,122], |
| 96 | darkviolet:[148,0,211], |
| 97 | fuchsia:[255,0,255], |
| 98 | gold:[255,215,0], |
| 99 | green:[0,128,0], |
| 100 | indigo:[75,0,130], |
| 101 | khaki:[240,230,140], |
| 102 | lightblue:[173,216,230], |
| 103 | lightcyan:[224,255,255], |
| 104 | lightgreen:[144,238,144], |
| 105 | lightgrey:[211,211,211], |
| 106 | lightpink:[255,182,193], |
| 107 | lightyellow:[255,255,224], |
| 108 | lime:[0,255,0], |
| 109 | magenta:[255,0,255], |
| 110 | maroon:[128,0,0], |
| 111 | navy:[0,0,128], |
| 112 | olive:[128,128,0], |
| 113 | orange:[255,165,0], |
| 114 | pink:[255,192,203], |
| 115 | purple:[128,0,128], |
| 116 | violet:[128,0,128], |
| 117 | red:[255,0,0], |
| 118 | silver:[192,192,192], |
| 119 | white:[255,255,255], |
| 120 | yellow:[255,255,0], |
| 121 | transparent: [255,255,255] |
| 122 | }; |
| 123 | |
| 124 | })(jQuery); |