CODEWITHSUNDEEP
jquery
Adam
Adam

Reputation: 455

jQuery mouseover function only works for one div

I have a jQuery function that on hover will show some icons, I am very new to jQuery and can't for the life of me work out why it only works on one div.

I have multiple divs this function needs to work with.

My jQuery:

$("#hovercam").mouseenter(function() {
    $('#textfieldlonger').css('margin-top', '200px');
    $('#hovericons').css('display', '');
 });
$("#hovercam").mouseleave(function() {
  $('#textfieldlonger').css('margin-top', '180px');
  $('#hovericons').css('display', 'none');
});

I have tried 

$(document).ready(function() {
    .....
});

But this did not do the trick.

All my Div's are 

<div id="hovercam">

Any help is much appreciated.

Upvotes: 0

Views: 354

Answers (1)

rahul
rahul

Reputation: 187070

Modify your HTML, so that all the div s will have unique id and same class name.

<div id="hoverCam1" class="hovercam">
</div>

And the your jQuery will be

$("#someparentelement").find("div.hovercam").hover(function(){
}, function() {
});

Read HTML ID attribute and .hover()

Upvotes: 1

Related Questions