jQuery Fading Rollovers |
For a list of all requirements and guidelines pertaining to posting a new Help topic, please click here.
This Month's Contests | Staff Member of the Month | Hosts Looking for Hostees | Hostees looking for Hosts | BigBookofResources
Submission Guidelines
jQuery Fading Rollovers |
Aug 16 2010, 08:17 AM
Post
#1
|
|
Mel Blanc was allergic to carrots. Group: Official Designer Posts: 6,371 Joined: Aug 2008 Member No: 676,291 |
Okay, so, I'm designing some stuff and I came to an interesting problem. I can't seem to get the navigation links to have the smooth fading effect that I'd want them to have. Mind you, I'm using a sprite for the navigation. So, yeah.
The only thing I can pretty much do is make it fade in and out from a low opacity. Like this: CODE $(function() { $('#navigation a').fadeTo('fast', 0.6); $('#navigation a').hover(function() { $(this).stop().fadeTo('slow', 1); }, function() { $(this).stop().fadeTo('slow', 0.6); }); }); But, I just want it to fade on it's hover state. I've tried a few plugins already, but none of them really seem to work. More so, it'd be nice to not use a plugin for what I assume is a simple effect. Help? |
|
|
Aug 16 2010, 03:40 PM
Post
#2
|
|
Mel Blanc was allergic to carrots. Group: Official Designer Posts: 6,371 Joined: Aug 2008 Member No: 676,291 |
No, I don't really want it to fade. That was just lack for a better word. I want it to have a smooth transition from the regular state of the rollover to the hover state of the rollover. The code I provided just showed how that fading transition was smooth.
|
|
|
Aug 16 2010, 05:58 PM
Post
#3
|
|
Mel Blanc was allergic to carrots. Group: Official Designer Posts: 6,371 Joined: Aug 2008 Member No: 676,291 |
Never mind, I used a different method. Instead of trying to fade the actual hover state of the rollover, I just assigned the hover state to a span tag within the anchor tags and set its opacity to zero. That way, when the contents of the span tags are hovered upon, it will animate its opacity to one and back to zero when its not hovered upon.
So, f*cking, simple. |
|
|