Question

我正在使用Jquery .animate来上下滚动UL以便您可以看到所有元素，我将如何制作IF ELSE语句。

IF UL 中的 FIRST LI 项位于顶部，不再滚动， IF 最后一项位于屏幕可见部分的底部，不再向下滚动，否则滚动510像素。

现在我的代码看起来像这样：

$('#down').click(function() {   
$(".project_thumbs").stop().animate({"top": "-=510px"});
});
$('#up').click(function() { 
if (".project_thumbs" (top = 0)){
    $(".project_thumbs").stop().animate({top:0});
}
else{
    $(".project_thumbs").stop().animate({"top": "+=510px"});
    }

Answer 1

Remy Sharp编写了一个jquery插件，用于处理滚动以及视口中是否有元素可见，您可以在此处找到它：http://remysharp.com/2009/01/26/element-in-view-event-plugin/

如果您还查看该页面上的第一条评论，则会有一些代码向jquery添加一个选择器，用于检查一个元素在视口中是否可见（这可能比整个插件更有用），这您可以检查UL中的底部LI（您可以使用：last选择器获取）是否在视口中，然后您就知道是否需要向下滚动。

希望这就是你要找的东西！

Answer 2

你可以使用面具来完成这个任务。将ul（position：absolute）括在div中（位置：relative，overflow：hidden，height：无论你需要什么）。然后，在触发运动时进行一些数学运算，以根据ul的高度确定是否/何时移动。（不需要担心李的本身，因为你可以使用ul的块来处理定位。）

我在这里设置了一个示例：http://jsfiddle.net/4nqng/

基本上，这会检查ul的位置是否能够根据它相对于面具的当前位置以及它被要求移动的方向移动。

如何在UL中创建特定LI的动画？

2 个答案: