Skip to content

Instantly share code, notes, and snippets.

@iamravenous
Last active April 23, 2024 09:05
Show Gist options
  • Save iamravenous/f06b341dbb8b0839a7b0 to your computer and use it in GitHub Desktop.
Save iamravenous/f06b341dbb8b0839a7b0 to your computer and use it in GitHub Desktop.
Smooth scrolling on page load if URL have a hash
/*
* Smooth Scroll on Pageload
* Smooth scrolling on page load if URL have a hash
* Author: Franco Moya - @iamravenous
*/
if (window.location.hash) {
var hash = window.location.hash;
if ($(hash).length) {
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 900, 'swing');
}
}
@iamravenous
Copy link
Author

Hey @mp111x000! offset.top obtains the coordinates of the element tagged by the hash.
You can use math operators to add or subtract pixels at your convenience.

scrollTop: $(hash).offset().top - 80

In this case 80 would be the difference in pixels you want to include.
You can also use another variable to calculate the size of an element, and use it instead of a fixed number.

@mp111x000
Copy link

Wow - this is exactly what I meant, sorry for the confused question. Works like a breeze, many thanks Franco! And all the best in the New Year.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment