我有一个像下面这样的 div:
<div class="col-xs-1 scroll-button"><i class="glyphicon glyphicon-chevron-left"></i> </div>
<div class="customer-ust-bant col-xs-22" id="letters">
<box ng-repeat="lt in alph" name="{{lt}}" id="{{lt}}"></box>
</div>
<div class="col-xs-1 scroll-button" ng-click="gotoBottom()"><i class="glyphicon glyphicon-chevron-right"></i> </div>
和盒子模板:
<div class="alphabet-kutu">{{name|uppercase}}</div>
和指令:
app.directive("box", function() {
return {
restrict:"E",
scope:{
name:"@"
},
templateUrl:"/static/templates/customers/box.html",
link:function(scope,elem,attrs,ctrl) {
}
};
})
如您所见,我的 div 包含字母表中的字母并采用水平滚动样式。
单击按钮时,我想将此 div 向左滚动。
$scope.gotoBottom = function (){
var element = angular.element( document.querySelector( '#letters' ) );
element.animate({scrollLeft: element.offset().left}, "slow");
//element.scrollLeft(100);
};
我尝试了 animate 和 scrollLeft 函数。但是我没有做任何好事。 AngularJS 中是否有针对这种情况的特殊功能?如何使用 jQuery 将 div 向左滚动?
最佳答案
我认为你应该给你的 scrollLeft 另一个值。因为在给定的代码中,您试图将元素滚动到其当前位置,所以它不会移动。例如:
element.animate({scrollLeft: element.offset().left - 50}, "slow");
PS:请确保您已包含 jQuery。 angularJS中嵌入的jQuery子集似乎不支持animate
功能
关于jquery - 如何使用 AngularJS 将 div 向左滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23017556/