我正在为angularJS创建一个简单的滑块,我只想在单击next和prev时限制项目的滚动。我不知道该如何进行,因此我需要一些帮助。
到目前为止我所做的。
JSBIN
仅Javascript / AngularJS / CSS3代码。请没有插件,库或jQuery。提前致谢。
最佳答案
在此处进行编辑:http://jsbin.com/liqomeya/4/edit
将slideAmount
更新为默认值为0
(其他设置导致不必要的单击以开始处理幻灯片)
添加了slideCurrent
变量-默认为0
(这将跟踪您正在播放的幻灯片)
在if (slideCurrent == 0) { return }
函数中添加了$scope.prev
(这可以防止您越过第一张幻灯片)
在if (slideCurrent == $scope.projects.length - 1) { return }
函数中添加了$scope.next
(这可以防止您跳过最后一张幻灯片)
在slideCurrent--
和$scope.prev
中添加了slideCurrent++
(为了增加/减少幻灯片)
将$scope.next
更新为slideAmount
而不是160
(每张幻灯片为160px,因此可以正确排列)