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 |