problem with animation .stop() method

[Kola]

I am using animate to scroll image up/down with different speed as we scroll up/down the page…and animation stops when image goes above or below a certain point…
but sometimes stop method doesnt work and image doesnt stop scrolling…Below is the script that i used…leafEffect is class of image and isVisible is function to check if element is in viewport…Please help

---

var x=($(‘.leafEffect’).position().top);

//window.scroll event
{
//on downscroll
{
if($(‘.leafEffect’).isVisible()) { $(‘.leafEffect’).animate({top:
‘ -=1.2 ‘}, 5); }

if($(‘.leafEffect’).position().top<x-50)
{
$(‘.leafEffect’).stop(true, false);
}
}
//on upscroll
{
if($(‘.leafEffect’).isVisible()) { $(‘.leafEffect’).animate({top:
‘ +=1.2 ‘}, 5); }

if($(‘.leafEffect’).position().top>x+40)
{
$(‘.leafEffect’).stop(true, false);
}
}

}

---

[Mottie]

I think what is missing is that the .position() of the animation returns the coordinates relative to the offset parent. Whereas .offset() is relative to the document.

Without a demo to work with, I think you’ll actually need to use window scrollTop() to check the scroll position of the page, then add the .offset() of the image to determine the actual position.

[Author]

Posts