CODEWITHSUNDEEP
jquery
markzzz
markzzz

Reputation: 48065

JQuery - Add a mouse-event listener to a class

<div class="teamMain">
    <div class="teamScroll">
        PRIMO
    </div>

    <div class="teamScroll">
        SECONDO
    </div>

    <div class="teamScroll">
        TERZO
    </div>
</div>

And i'd like to add a sort of listener (such mouseover or mouseout) for each of this div, by taking the class teamScroll as reference.

I know there is delegate method, but it works only with jquery-1.4.2 version (which, as posted time ago for another problem) broke some functions with IE6.

There is other way to do this without put N listener for N div?

Cheers

Upvotes: 3

Views: 10973

Answers (3)

Macy Abbey
Macy Abbey

Reputation: 3887

$('.teamScroll').mouseover(function(){

});

Upvotes: 0

Thariama
Thariama

Reputation: 50840

Try

$('.teamScroll').bind('onmouseover', function() {
  alert('Mouseover');
});

Upvotes: 1

Nick Craver
Nick Craver

Reputation: 630637

You can use a normal .hover() handler, like this:

$(".teamScroll").hover(function() {
  //mouse on the item
}, function() {
  //mouse off the item
});

That's the way that always works (but does 2n handlers like you're asking about), assuming 1.4.2 isn't an option...if you're on at least 1.3.2, there's .live() like this:

$(".teamScroll").live("mouseenter", function() {
  //mouse on the item
}).live("mouseleave", function() {
  //mouse off the item
});

The difference here is that .live() runs an extra selector and the event bubbles all the way up to document...as well as it actually maps to mouseover and mouseout under the covers, which is often undesirable.

Instead, I'd suggest the .delegate() route, and seeing if jQuery 1.4.4 fixes the issue you have in 1.4.2, there were several AJAX tweaks in 1.4.3/1.4.4.

Upvotes: 5

Related Questions