Question

We call a .live() method like this:

$('.link').live('click', loadContent);

But what about if I’m binding to hover instead, which calls for two functions separated by a comma? When I put in this:

$('.thumb.dim').live('hover', function(){$(this).removeClass('dim');}, function(){$(this).addClass('dim');});

The mouseenter event does trigger the first function above (removeClass('dim')), but on mouseleave nothing happens. Is there a correct way to write this?

Answer 1

live only takes one callback, but you can check the passed event information for the type of the callback:

$('.thumb.dim').live('hover', function(e) {
    if (e.type == 'mouseover') {
        $(this).removeClass('dim');
    } else {
        $(this).addClass('dim');
    }
});

Alternatively since you’re just removing/adding a class, you can do;

$('.thumb.dim').live('hover', function(e) {
    $(this).toggleClass('dim');
});