Add jquery effects on default wp menu

  • ktsixit

    (@ktsixit)


    12 years, 4 months ago

    Hi all,
    The main menu in my website is displayed by “wp_nav_menu” function. It’s a dropdown menu controlled by css. I’d like to add some jquery effects everything I’ve tried so far is not working.

    This is the javascript code I’m using:

    <script type="text/javascript">
$(document).ready(function() {
	$("ul#menu-main ul").css({ display: 'none' });
	$("ul#menu-main li").hover(function() {
		$(this).find('ul.sub-menu')
			.stop(true, true).delay(50).animate({ "height": "show", "opacity": "show" }, 200 );
	}, function(){
		$(this).find('ul.sub-menu')
			.stop(true, true).delay(50).animate({ "height": "hide", "opacity": "hide" }, 200 );
	});

});
</script>

    The code seems correct to me but it’s not working. I’m using jquery v1.6.1 in my pages. Am I missing something?

Viewing 3 replies - 1 through 3 (of 3 total)
  • Oleg Dudkin

    (@olegdudkin)

    12 years, 4 months ago

    Try to replace
    $(document).ready(function() {
    with
    jQuery(document).ready(function(4) {

    And also give a link to yout site, please.

    Thread Starter ktsixit

    (@ktsixit)

    12 years, 4 months ago

    Thanks a lot for your help Oleg. Your suggestion worked:)

    But could you also explain me why “$” failed, as soon as I’m already loading jquery in my website? Why should I use “jQuery” instead?

    Thank’s again!

    Oleg Dudkin

    (@olegdudkin)

    12 years, 4 months ago

    WordPress developers made jquery not to load as “$”.
    There are different frameworks that also can reserve “$” sign for themselves. To avoid any collisions jQuery should be always reffered as “jQuery”.
    Usually it’s not a problem – you still can use “$” inside such function:
    jQuery(document).ready(function($) {

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Add jquery effects on default wp menu’ is closed to new replies.