Question

I have a horizontal menu with a dropdown div on the first menu item.

http://jsfiddle.net/2dPXY/

I want the first link “Find a Doctor” to still be click-able, so someone can either choose from the dropdown, or just click the link.

Right now it’s not clickable, and I can’t figure out why. I tried adding the following to my jquery file, but it didn’t work:

(This is also in the jfiddle above)

      $("#menu li a").click(
        function () {
          console.log($(this).html());
          window.location.href = $(this).attr('href');
        }
      );

Any idea why I can’t click on a link that has a dropdown and how to fix it?

Answer 1

The problem is that your .submenu div is positioned on top of the tabs, so it’s intercepting the click. (I found that it was positioned over the tabs by setting a 10-pixel red border). All you have to do to fix this is use a top of 30px instead of a margin-top in #catmenu.

See my updated jsfiddle: http://jsfiddle.net/q9A9T/