mooving mouse over the edge

mooving mouse over the edge

Hi,

i have a jquery here on this demo page: http://igor.jeff.at/igor/index.php?id=50

it looks cool but there is one thing that i want to get rid off.

When I moove the mouse over the edge of the white area (.itemdisc) the background is jumping.

please help me with an approach how to fix that.


thank you

var zoomspeed = 400;
var textspeed = 500;
$(document).ready(function() {
   $('.ijgalleryitem').bind("mouseover", imgMouseOver);
   $('.ijgalleryitem').bind("mouseout", imgMouseOut);
});
function imgMouseOver() {
   if($(this).find('.itemimg').is(':animated')) {
      $(this).find('.itemimg').stop().animate( { width:"120%", height:"120%", right:"10%" }, zoomspeed, "linear", function() {
         $(this).next().animate( { bottom:"0px", right:"0px" }, textspeed );
      });
   } else {
      $(this).find('.itemimg').animate( { width:"120%", height:"120%", right:"10%" }, zoomspeed, "linear", function() {
         $(this).next().animate( { bottom:"0px", right:"0px" }, textspeed );
      });
   }
}

function imgMouseOut() {
   if($(this).find('.itemimg').is(':animated')) {         
      $(this).find('.itemimg').stop().animate( { width:"100%", height:"100%", right:"0%" }, zoomspeed, "linear", function() {         
         $(this).next().animate( { bottom:"-113px", right:"-285px" }, textspeed );
      });
   } else {
      $(this).find('.itemimg').animate( { width:"100%", height:"100%", right:"0%" }, zoomspeed, "linear", function() {         
         $(this).next().animate( { bottom:"-113px", right:"-285px" }, textspeed );
      });
   }
}