CODEWITHSUNDEEP
javascriptjqueryhtmlcsspopup
Tom Gullen
Tom Gullen

Reputation: 61729

Jquery mouseover function not firing

I have this Jquery code:

$(document).ready(function() {

    // Do menu mouseovers
    $('.bar a').each(function() {

        var Link = $(this);
        var LinkID = Link.attr("ID");

        $('.menu-pop').each(function() {
            var PopID = $(this).attr("data-for");

            // We have found a match, assign events
            if (PopID == LinkID) {

                Link.mouseover = (function() {
                    alert("trucks lol");
                });

                return;
            }
        });

    });

});

It's for a popup menu I'm writing. The simplified structure of the menu is:

<div class="bar">
    <a class="item">Home</a>
    <a class="item" id="mnuAnother">Another Link</a>
</div>

<div class="menu-pop" data-for="mnuAnother">
    Links and stuff
</div>

I'm expecting it to do the alert when my mouse goes over the "Another" link, but at present it throws no errors/no alert.

Any help appreciated.

Upvotes: 0

Views: 2735

Answers (3)

NickAldwin
NickAldwin

Reputation: 11744

Did you try

Link.mouseover(function() {
  alert("trucks lol");
});

(using jQuery's mouseover function which is a shortcut for binding the mouseover event)

Upvotes: 4

thirtydot
thirtydot

Reputation: 228152

See: http://jsfiddle.net/rQ72v/

Change this:

Link.mouseover = (function() {
    alert("trucks lol");
});

to this:

Link.mouseover(function() {
    alert("trucks lol");
});

Link.mouseover = doesn't really make any sense.

Perhaps Link.onmouseover = would work (or would you need Link[0].onmouseover =?) in terms of raw JavaScript.

But, it's much better to use jQuery's .mouseover().

Upvotes: 1

Paulo Santos
Paulo Santos

Reputation: 11567

I would replace the 

// ...
$('.bar a').each(function() {
    var Link = $(this);
// ...

by something line

// ...
$('.bar a').each(function(item) {
    var Link = $(item);
// ...

Upvotes: 0

Related Questions