Jquery Hover() event problem!

[Johns3n]

Hi PHPfreaks.com

 

I'm having some trouble with Jquery's Hover() event!

 

I'm currently creating a portfolio where i need a image to shift it's position, once it's hovered,  for that purpose i've written this small script!

 

<script type="text/javascript">
$("ul.hover_block li").live("hover",
        function()
        {
	  $(this).find('img').animate
	  ({top:'50px'},{queue:false,duration:500});
        },
	function()
	{
	  $(this).find('img').animate
	  ({top:'0px'},{queue:false,duration:500});
	}
	);
</script>

 

Now the scripts works 50% because it correctly shifts the image once it's hovered, however once mouse leaves, the image doesn't shift back, it just stays in it's hovered position!

Hope you can help me! (and yes I need the live() function, because i'm running this hover() script along with a Jquery Quicksand Plugin!

[Johns3n]

Solved it myself! When targeting a specific <ul> as i were, delegate() was a better option! ^^ So the solution is as it follows:

<script type="text/javascript">
$("ul.hover_block").delegate("li", 
{
  mouseenter: function() 
  { 
    $(this).find('img').animate({top:'50px'},{queue:false,duration:500});
  },
  mouseleave: function() 
  {
    $(this).find('img').animate({top:'0px'},{queue:false,duration:500});
  }
});
</script>