$anchorScroll
According to HTML5 rules, when this function is called, it checks the hash value of the current url and scrolls to the corresponding element.
Listen to $() and scroll to the place where the anchor specified by url.
Can be disabled via $().
rely:$window $location $rootScope
use:$anchorScroll([hash]);hash will specify the position where the element is scrolled to, and if the parameter is omitted, $() will be used as the default value.
property:number function(){} jqLite
If this value is set, a vertical scrolling offset will be specified. This kind of scenario is often used to have fixed positioning elements at the top of the page, such as navigation bars, heads, etc. (giving out head space).
yOffset can be specified in various ways:
- number : A fixed pixel value can be used (unit-free).
- function : This function is called every time $anchorScroll() is executed, and it must return a number representing the displacement (unit-unit pixel value).
jqLite : A jqLite/jQuery element can be specified as a displacement value. This displacement value takes the distance from the top of the page to the bottom of the element.
Notice:Only when the positioning method of elements is fixed positioning should it be taken into consideration. This setting is useful when responsive navigation bars/heads need to be adjusted to their height or positioned according to the view.
<div ng-app="Demo" ng-controller="testCtrl as ctrl"> <div ng-click="()">Jump to the bottom</div> <div ng-click="()">Jump to the top</div> </div>
(function () {
("Demo", [])
.controller("testCtrl",["$location", "$anchorScroll",testCtrl]);
function testCtrl($location,$anchorScroll){
= function () {
$("top");
$anchorScroll();
};
= function () {
$("bottom");
$anchorScroll();
};
};
}());
The above article jumping to the specified anchor point instance ($anchorScroll) in angularJs is all the content I share with you. I hope you can give you a reference and I hope you can support me more.