- This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
Viewing 2 posts - 1 through 2 (of 2 total)
- The forum ‘JavaScript’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › JavaScript › problem with animation .stop() method
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);
}
}
}
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.