$anchorScroll
Improve this Doc View Source $anchorScroll - $anchorScrollProvider
- service in module ng
When called, it scrolls to the element related to the specified hash or (if omitted) to the current value of $location.hash(), according to the rules specified in the HTML5 spec.
It also watches the $location.hash() and automatically scrolls to match any anchor whenever it changes. This can be disabled by calling $anchorScrollProvider.disableAutoScrolling().
Additionally, you can use its yOffset property to specify a vertical scroll-offset (either fixed or dynamic).
Dependencies
Usage
$anchorScroll([hash]);
Arguments
Param Type Details hash (optional) string The hash specifying the element to scroll to. If omitted, the value of $location.hash() will be used.
Properties
-
yOffset
numberfunction()jqLite
If set, specifies a vertical scroll-offset. This is often useful when there are fixed positioned elements at the top of the page, such as navbars, headers etc.
yOffset can be specified in various ways:
-
number: A fixed number of pixels to be used as offset.
-
function: A getter function called everytime
$anchorScroll() is executed. Must return a number representing the offset (in pixels).
-
jqLite: A jqLite/jQuery element to be used for specifying the offset. The distance from the top of the page to the element's bottom will be used as offset.
Note: The element will be taken into account only as long as its position is set to fixed. This option is useful, when dealing with responsive navbars/headers that adjust their height and/or positioning according to the viewport's size.
In order for yOffset to work properly, scrolling should take place on the document's root and not some child element.
The example below illustrates the use of a vertical scroll-offset (specified as a fixed value). See $anchorScroll.yOffset for more details.
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.6.4/docs/api/ng/service/$anchorScroll
When called, it scrolls to the element related to the specified hash or (if omitted) to the current value of $location.hash(), according to the rules specified in the HTML5 spec.
It also watches the $location.hash() and automatically scrolls to match any anchor whenever it changes. This can be disabled by calling $anchorScrollProvider.disableAutoScrolling().
Additionally, you can use its yOffset property to specify a vertical scroll-offset (either fixed or dynamic).
Dependencies
Usage
$anchorScroll([hash]);
Arguments
| Param | Type | Details |
|---|---|---|
| hash (optional) | string | The hash specifying the element to scroll to. If omitted, the value of $location.hash() will be used. |
Properties
-
yOffset
numberfunction()jqLiteIf set, specifies a vertical scroll-offset. This is often useful when there are fixed positioned elements at the top of the page, such as navbars, headers etc.
yOffsetcan be specified in various ways:-
number: A fixed number of pixels to be used as offset.
-
function: A getter function called everytime
$anchorScroll()is executed. Must return a number representing the offset (in pixels).
-
jqLite: A jqLite/jQuery element to be used for specifying the offset. The distance from the top of the page to the element's bottom will be used as offset.
Note: The element will be taken into account only as long as itspositionis set tofixed. This option is useful, when dealing with responsive navbars/headers that adjust their height and/or positioning according to the viewport's size.
In order foryOffsetto work properly, scrolling should take place on the document's root and not some child element. -
number: A fixed number of pixels to be used as offset.
© 2010–2017 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://code.angularjs.org/1.6.4/docs/api/ng/service/$anchorScroll
