$(hash) element is not found.
Example: <a href="#something">Link</a> if there isn’t an element with id something is not found then it’ll error out. You need to only perform the scrolling when the element exists.
$(document).ready(function(){
$("a").on('click', function(event){
if (this.hash){
event.preventDefault();
var hash = this.hash,
element = $(hash);
if(element.length){ //check if the element exists before doing the scrolling
$('html, body').animate({
scrollTop: element.offset().top
}, 800, function(){
window.location.hash = hash;
});
}
}
});
});
Good day. I found this error while I’m working on my project. Yesterday, I used javascript inside the html file and it’s working fine but when I made it as an external script and linked to the index.html, the smooth scroll doesn’t seem to work on some links to the section. Here’s the error below:
smoothscroll.js:16 Uncaught TypeError: Cannot read property 'top' of undefined
at HTMLAnchorElement.<anonymous> (smoothscroll.js:16)
at HTMLAnchorElement.dispatch (jquery.min.js:2)
at HTMLAnchorElement.y.handle (jquery.min.js:2)
It works fine on links such as <a href="#"></a> and the likes, but when it comes to the navigation bar that links to the section of the same page, it produces that error above in the console.
It’s likely you are running the script before the dom is ready or the navigation is dynamically generated after events are bound to links. Try to add your script from the bottom close to
Looks like the issue is with smooth scroll being initialized on an undefined element. If you could provide a js code snippet of how the smooth scroll is being initialized I could probably tell what the problem is.
