Question

sorry i’m asking this again, but I can’t find a solution. I know there are a few posts out there, but for me nothing seems to work. I’m loading a part of a website with the jquery load() method. I’ll apply the following rule to all links inside them:

$('.file a').live('click', function(e) {
    alert('click event firde');
});

this click event works just perfectly fine.
however i want to have a hover event on those links as well:

$('.file a').live('mouseover mouseout', function(event) {
    if (event.type == 'mouseover') {
    alert('why doesn't the hover event fire????');
 } else {
    // do something on mouseout
    }
});

i have no idea why my hover event wont fire? can i only apply one event handler with live to a specific selector???

any ideas?

Answer 1

You want to bind the events separately, like this:

$('.file a').live('mouseenter', function() {
  //hover code
}).live('mouseleave', function() {
  //stopped hovering code
});

We’re using mouseenter and mouseleave because these are the events that .hover() binds to.