/* | |
* jquery.xgradient.js | |
* http://blog.mach3.jp/ | |
* | |
* Publish Date : 2010/5/13 | |
* Requirement : jQuery 1.4 or later | |
* http://jquery.com/ | |
* | |
* Copyright 2010, Mach3 | |
*/ | |
$.fn.xgradient = function(_dir,_from,_to){ | |
this.getColor = function(_hex){ | |
return { | |
a: parseInt(_hex.substr(0,2),16)/255, | |
r: parseInt(_hex.substr(2,2),16), | |
g: parseInt(_hex.substr(4,2),16), | |
b: parseInt(_hex.substr(6,2),16) | |
}; | |
}; | |
this.config = { | |
dir:_dir, | |
from:_from, | |
to:_to | |
}; | |
var _this = this; | |
this.each( function(){ | |
var from = _this.getColor(_this.config.from.replace("#","")); | |
var to = _this.getColor(_this.config.to.replace("#","")); | |
if ( $.browser.mozilla ){ | |
$(this).css("background", | |
String("-moz-linear-gradient(%dir%,%from%,%to%)") | |
.replace(/%dir%/, ((_this.config.dir=="y") ? "top" : "left")) | |
.replace(/%from%/, "rgba("+from.r+","+from.g+","+from.b+","+from.a+")") | |
.replace(/%to%/, "rgba("+to.r+","+to.g+","+to.b+","+to.a+")") | |
); | |
} else if ( $.browser.webkit ){ | |
$(this).css("background", | |
String("-webkit-gradient(linear,left top,%end%,from(%from%),to(%to%))") | |
.replace(/%end%/, (_this.config.dir=="y") ? "left bottom" :"right top" ) | |
.replace(/%from%/, "rgba("+from.r+","+from.g+","+from.b+","+from.a+")") | |
.replace(/%to%/, "rgba("+to.r+","+to.g+","+to.b+","+to.a+")") | |
); | |
} else if ( $.browser.msie ){ | |
$(this).css("filter", String("progid:DXImageTransform.Microsoft.Gradient(GradientType=%dir%,StartColorStr=%from%,EndColorStr=%to%);") | |
.replace(/%dir%/, (_this.config.dir=="y") ? 0 : 1 ) | |
.replace(/%from%/, _this.config.from) | |
.replace(/%to%/, _this.config.to) | |
); | |
} | |
}); | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment