myApp.directive('scrollOnClick', function() {
return {
restrict: 'A',
link: function(scope, $elm) {
$elm.on('click', function() {
$("body").animate({scrollTop: $elm.offset().top}, "slow");
});
}
}
});
演示：http ://plnkr.co/edit/yz1EHB8ad3C59N6PzdCD?p=preview
要获取有关创建指令的帮助，请查看视频，网址为http://egghead.io，从＃10“第一个指令”开始。
：要使其滚动到href指定的特定元素，只需选中attrs.href。
myApp.directive('scrollOnClick', function() {
return {
restrict: 'A',
link: function(scope, $elm, attrs) {
var idToScroll = attrs.href;
$elm.on('click', function() {
var $target;
if (idToScroll) {
$target = $(idToScroll);
} else {
$target = $elm;
}
$("body").animate({scrollTop: $target.offset().top}, "slow");
});
}
}
});
然后，您可以像这样使用它：<div scroll-on-click></div>滚动到单击的元素。或<a scroll-on-click href="#element-id"></div>滚动到带有ID的元素。
602392714
清零编程群