jQuery fading rollover - Works in FF and IE... not Safari?!
Basically I built off of a fading script that I found for fading buttons. I have 2 images, one positioned directly over the top. Then I do a hover to make the button look like it's fading to another color on rollover. For some reason, Safari is only fading a little over half of the button, has anyone else had trouble with something like this?? Any ideas why it works in IE6 and up of all things, but not Safari?
Here's the js:
this.fadeLinks = function() {
var selector = "#a_trio1, #a_trio2, #a_trio3, #more1, #close1, #more2, #close2, #more3, #close3"; //modify this line to set the selectors
var speed = "normal" // adjust the fading speed ("slow", "normal", "fast")
var bgcolor = "#ff6d1a"; //dk orange
var bgcolor1 = "#f89828"; // unfortunately we have to set bg color because of that freakin' IE *!$%#!!?!?%$!
//please use the same background color in your links as it is in your document.
$(selector).each(function(){
$(this).css("position","relative");
var html = $(this).html();
$(this).html("<span class=\"one\">"+ html +"</span>");
$("span.two",$(this)).css("opacity",0);
$(this).hover(
function(){
$("span.one",this).fadeTo(speed, 0);
},
function(){
$("span.one",this).fadeTo(speed, 1);
}
)
});
};
$(document).ready(function(){
fadeLinks();
});