Fri, 2010-03-05 19:41
I am trying to improve my navigation so it fades from one background image to another using jQuery. I have heard the benefits to using it so I want to give it a shot. So I searched the web and found this tutorial. http://jqueryfordesigners.com/image-fade-revisited/
I am using a transparent png background image sprite with text overlaying the background image. The tutorial uses jquery to fade a div on top of another looking like it fades. Since I am using a transparent png, that wont work.
So, is there a way to cross-fade the background images on hover with jquery and also fade the text color?
Take a look at my nav for a better idea: http://www.mtrservices.com/
Any help would be great. Thanks!
Sat, 2010-03-06 02:39
#1
Does this help:
Does this help: http://snook.ca/archives/javascript/jquery-bg-image-animations/ ?
Sun, 2010-03-07 06:55
#2
ya thats more helpful, but i
ya thats more helpful, but i would like the jquery to fade it into the next bg position in my sprite rather than it moving the bg image. how is this done? thanks.
Sat, 2010-03-13 22:01
#3
Try changing the background
Try changing the background position of your sprite on your a:hover
a { background-position: 0 0; } a:hover { background-position: 0 -30px; }