Question

我正在为我的项目制作一个拇指滑块旋转木马。我是用css3做的。我做的是，我使用了一个封面div，里面我使用了一个ul并左右滑动它。封面div溢出被隐藏。现在它工作正常，但问题是，我无法在李的结尾处停止滑行。我怎么能实现这一目标？我尝试了if else语句，但我很困惑。那里有评论的完整的clode就在这里的 http://jsfiddle.net/pqHAK/

这是示例代码

        $('#thumbsList').css('margin-left', positionToBeMoved + 'px');

完整的代码在小提琴中。请告诉我我在哪里做错了感谢。

Answer 1

试试这个小提琴：

DEMO

添加此条件以检查位置：

$('li').length/2 * 154 - window.innerWidth < positionToBeMoved

这是li的数量除以2减去窗口的宽度来计算位置。

您可能需要略微调整此公式，但这应该指导您正确的方向。

Answer 2

左箭头单击使用此

            if (currentPosition!=0) {
                var positionToBeMoved = currentPosition + 77;

                // Setting th Final Fix//
                $('#thumbsList').css('margin-left', positionToBeMoved + 'px');
            } else {


            }

然后它将在第一个div向左后停止传递。但是你必须要小心，在检查之前移动应该停止

css拇指旋转木马停在0

2 个答案: