Currently, I am working on a horizontal menu that includes submenus. My goal is to use Javascript to display the submenu when a user hovers over the parent menu.
I created a JSFiddle example, which seems to be experiencing issues in FireFox! However, it works perfectly fine in Chrome, IE, and Safari!
If you'd like to test the page for yourself, visit: www.andreferreira.eu5.org
To view the code, click here: jsfiddle.net/R2ySL/
<script>
$(document).ready(function () {
var $nav = $('#menu > li');
$nav.hover(
function() {
$('li', this).stop(true, true).slideDown('fast');
$('a',this).first().css({"background-color":"#FFF", "color":"#debe65"});
},
function() {
$('ul', this).slideUp('fast');
$('a',this).first().css({"background-color":"", "color":"#FFF"});
}
);
});
</script>