MyBB Community Forums

Hi,

I'm designing a new website but I've got stuck on some javascript/jQuery.

I have a list that currently uses this syntax:

<ul>
	<li><a href="#">Link 1</a></li>
	<li><a href="#">Link 2</a></li>
	<li><a href="#">Link 3</a></li>
	<li><a href="#">Link 4</a></li>
</ul>

I am using the :hover thing to set the background when the a is hovered. I am trying to find a way to have the background fade in/out but can't find it anywhere. I am guessing this would be jQuery rather than standard javascript.

Thanks in advance

Is the background an image?

jQueryUI comes with fade() functions as far as I remember, otherwise I'd just switch classes and put an on hover span like this:

                    $(this).hover(function () {

                        // on hover

                        $span.stop().fadeTo(700, 1);

                    }, function () {

                        // off hover

                        $span.stop().fadeTo(700, 0);

                    });

See http://zaiendo.de for a living example (the menu at the top).

Thanks for that. I have managed to work this out now

Great to hear, you are welcome!