jQuery .hover not working

Ben Jackson picture Ben Jackson · Jun 21, 2012 · Viewed 21.7k times · Source

Hi What is wrong with my code here:

When I hover over #open #pull_down_content should be moving down the page from the header and when I move away from #open it should move back up. But when I test the code as soon as the page loads #pull_down_content moves down the screen before I even hover over it.

$(function() {

//Open on hover 
$('#open').hover((function(){
    $('#pull_down_content').animate({'top':'-0px'},1000);
})

//Close when not hovered
(function(){
    $('#pull_down_content').animate({'top':'-340px'},1000);

})
});
);

Answer

Selvakumar Arumugam picture Selvakumar Arumugam · Jun 21, 2012

Try fixing your function like below,

$(function() {        
    $('#open').hover(function(){ //Open on hover 
        $('#pull_down_content').animate({'top':'-0px'},1000);
    },    
    function(){ //Close when not hovered
        $('#pull_down_content').animate({'top':'-340px'},1000);    
    });
});