I am trying to make an animation on website spiderspun .co .uk 
(spaces added to avoid being called a link builder )

I have two div:
#sidebar1-menu ul{position:relative;background-image:url("../spiderisms.png");
background-position:525px 110px;background-repeat:no-repeat;}
#sidebar1-menu a{...css stuff...}
I am using a backgroundPos plugin.

In order to animate the image (a circle) i am using code:
$('#sidebar1-menu ul')
 .css( {backgroundPosition: "4px 5px"} )
 .mouseover(function(){
 var offset = $(this).children.offsetTop;
 $(this).stop().animate(
 {backgroundPosition:"(4px 32px)"}, 
 {duration:1000})
 })
 .mouseout(function(){
 $(this).stop().animate(
 {backgroundPosition:"(4px 5px)"}, 
 {duration:5000})
 })
</script> 

basically i want to find out what child li has been selected to assign the right 
length of animation...

 var offset = $(this).children[1].offsetTop;

gives me the right offset for that mouseover - how the heck do i find whether 
the mouse is over that li? there is no isSelected keyword etc...

Am i going about this the right way or is there a much easier approach to this? 
Thankyou