Go-to
Smooth scroll back to the top of the page.
How to use
Copy-paste the following <script> near the end of your pages under JS Implementing Plugins to enable it.
<script src="../assets/vendor/hs-go-to/dist/hs-go-to.min.js"></script>
Copy-paste the init function under JS Plugins Init., before the closing </body> tag, to enable it.
<script>
$(document).on('ready', function () {
// initialization of go to
$('.js-go-to').each(function () {
var goTo = new HSGoTo($(this)).init();
});
});
</script>
Basic example
Below is a static Go to (meaning its position have been overridden for demonstration purposes. However the HTML markups in the clipboard are not).
Referenced to a page
Methods
| Parameters | Description | Default value |
|---|---|---|
targetSelector |
An element to which the browser window will scroll, by clicking on the element to be initialized | null |
compensationSelector |
An element whose height will be taken into account when calculating the point, upon reaching which the scroll will end | null |
animationInit |
Name of the class that is responsible for the activation of css animation | 'animated' |
animationIn |
Name of the class, css-animation, which is given when the initialized element | 'fadeIn' |
animationOut |
Name of the class, css-animation, which is given when the initialized element disappears | 'fadeOut' |
duration |
Animation duration | 400 |
offsetTop |
Distance that must be scrolled for the initialized object to appear | 0 |
position.init |
CSS properties top || bottom || left || right, which are added when the element is initialized |
null |
position.hide |
CSS properties top || bottom || left || right, which are added when the element is disappears |
null |
position.show |
CSS properties top || bottom || left || right, which are added when an element appears |
null |
isReferencedToOtherPage |
if true, then allows you to go to another page, disabling the scroll function to the element specified in targetSelector |
null |