Question

Right now I havae a menu, that I’m using jquery to do a fade in and out on mouseenter and leave

this is super basic jsfiddle of the function (loos like hell i know, but you ge the idea)
http://jsfiddle.net/A26d9/2/

So..right now only the text is clickable. How can I make it so the entire div is clickable. I’ve tried using

    $(".home_hover").click(function(){
     window.location=$(this).find("a").attr("href");
     return false;
});

but it just dissables the entire menu. I know this is easy. I’m just blank right now.

Thanks!

Answer 1

Try this, it will look for an a element inside the #home div, and send the browser there on click.

$(document).ready(function() {
    $('#home')
        .mouseenter(function() {
            $('.home_hover', $(this)).fadeIn()
        })
        .mouseleave(function() {
            $('.home_hover', $(this)).fadeOut();
        })
        .click(function() {
            var link = $("a", $(this));
            if (link.length) {
                window.location.assign(link.attr("href"));
            }
        });
});

Example fiddle