Animate {“Top”}如何停止在顶部位置滚动div为0 px - Jquery

时间:2013-10-09 18:17:14

标签: javascript jquery css html

尝试创建滚动div。一旦它到达特定的顶部位置并且一直滚动到底部并且没有超过父div到无限滚动区域,则想要停止(thescrollingdiv) div。 thescrollingdiv没有指定任何高度,但它的父div确实。谢谢。

$('#div a).click(function(e){ e.preventDefault(); $('#thescrollingdiv').stop(true,true).animate({ "top": '-=100px'}, 500)

1 个答案:

答案 0 :(得分:0)

ScrollTop告诉你你在哪里。检查现有的顶部与滚动顶部并进行数学计算以设置限制。

var scrollTop = $('#thescrollingdiv').scrollTop();
var newTop = parseFloat($('#thescrollingdiv').css('top')) - 100;

if (scrollTop < 0) {
  newTop = 0;
}

$('#thescrollingdiv').stop(true,true).animate({ "top": newTop}, 500)

更新

像这样。

var topLimit = 0;
var bottomLimit = 800;

var containerTop = parseFloat($('container').css('top'));
var containerBottom = parseFloat($('container').css('height')) + containerTop;

var destination = containerTop - 100;

// compensate for going too far up
destination = (destination < 0) ? 0 : destination;

// compensate for going too far up
destination = (containerBottom > bottomLimit) ? bottomLimit : destination;

// now that you know you are within your custom limits, animate it.
animate(destination);

这几乎是伪代码,因为我不知道你的代码是什么样的,但它给你一个想法。在你首先调用动画之前,你必须真正做好设置'newTop'限制的工作。

你可以搞清楚。不过,不要成为懒惰的程序员。