jQuery Dropdown flickers in Firefox, does not work in Chrome or Safari

12 Views

My dropdown fade effect that I use on regular HTML/CSS sites is not working too well with this WordPress site: http://174.120.235.57/~phvne/

I’m putting the script calls in the footer right before the closing body tag.

Read More

I’m new with using jQuery and WordPress…any help is greatly appreciated!!!

Here’s the jQuery code I’m using: 

    jQuery(document).ready(function( $ ) {

    var speed=500;
    $('#nav li').hover(
        function () {
            //show its submenu
            $('ul', this).fadeIn(speed);
        }, 
        function () {
            //hide its submenu
            $('ul', this).fadeOut(speed);           
        }
    );
});
Post Views: 12

Related posts

Leave a Reply

2 comments

  1. Try using this:

    $(document).ready(function () { 
var speed = 500; 
$('#nav li').hover(
    function () {
      //show its submenu
     $('ul', this).stop(true).slideDown(speed);
    },
    function () {
      //hide its submenu
     $('ul', this).stop().hide(speed);      
    }
  );
});

    That’s what I use for my dropdown, and it works fine.

  2. Just to be safe, you may want to avoid conflict with other JQuery on the page.
    For example, you may try the following:

    $j=jQuery.noConflict();
$j(document).ready(function() {
    var speed=500;
    $j('#nav li').hover(
        function () {
            //show its submenu
            $j('ul', this).fadeIn(speed);
        }, 
        function () {
            //hide its submenu
            $j('ul', this).fadeOut(speed);           
        }
    );
});