CODEWITHSUNDEEP
javascriptjquerymouseoveronmouseover
roger_that
roger_that

Reputation: 9791

jquery mouse events not working on anchor tag

I have an anchor tag and hovering which, I want my div to get displayed and should get hidden on mouseout. Just a typical jquery mouse events.

However, that doesn't seems to work. Could someone help me out on this. Check the fiddle http://jsfiddle.net/SLLeL/

$(".contributor").on({

mouseover: function(e) {

populateContributorsInArray(this);
var mousex = e.pageX - LEFT; // Get X coordinates
var mousey = e.pageY - TOP; // Get Y coordinates
$('#myDiv').css({
    top : mousey,
    right : mousex
});

var ul_data = "";
for ( var i = 0; i < CONTRIBUTORS.length; i++) {
    ul_data = ul_data + "<li>" + CONTRIBUTORS[i] + "</li>";
}
$("#myDiv ul").html(ul_data);
$("#myDiv").stop().hide().slideToggle('fast');
$("#arrow-left").stop().hide().slideToggle('fast');

},

mouseout: function(){
    alert("hi");
//Basically hide the div
//      $("#contributors_div").stop().hide().slideToggle('fast');
//      $("#arrow-left").stop().hide().slideToggle('fast');
}
});

And the HTML

<div id="myDiv">
    <div id="arrow-left"></div>
    <ul></ul>
</div>

<a class="contributor" href="#">Hover Me</a>

Upvotes: 0

Views: 436

Answers (1)

bipen
bipen

Reputation: 36551

you created an object instead of array.. so the error you had was Unexpected token , check your console...

change 

var CONTRIBUTORS = {"abc", "def"};

to array

var CONTRIBUTORS = ["abc", "def"];

and it should work.. though your fiddle is missing the populateContributorsInArray function which is called inside the mouseover method..

fiddle here

Upvotes: 2

Related Questions