jQuery scrolling animation works, but window.location.hash screws it over-Collection of common programming errors
Trying to solve this issue for 2 days now without success.
I have a main nav bar located in a single page website. The website has a scrolling animation. Whenever the user clicks a link from the nav bar, the window.location.hash should change.
Now, the thing is that it USED to change. But at the same time, it had flickering issues (which I couldn’t resolve with e.preventDefault()). The only way to stop the flickering was to add the stop() to the window.location.hash. So now I don’t have the flickering but the window.location.hash doesn’t change anymore, which isn’t a good thing.
This is the code
Home
About
Platform
Investors
Team
News & Press
Startup Explained
function gotoAndScroll(to){ if(typeof to == 'string') { var diff = (to == '#newsPress')? 74 : 83; $.scrollTo( {top: $(to).offset().top - diff}, 1500, {axis:'y',easing:'easeInOutCubic'}); } else if(typeof to == 'number'){ $.scrollTo({top:Number(to), left:0},{duration:1500}); } } $('.nav a').click(function(e) { if($(this).data('to') != '#home') gotoAndScroll($(this).data('to')); else gotoAndScroll(0); window.location.hash = $(this).data('to').stop(); }); $('a#logo').click(function(e) { if($(this).data('to') != '#home') gotoAndScroll($(this).data('to')); else gotoAndScroll(0); window.location.hash = $(this).data('to').stop(); });
Edit:
When clicking one of the nav links, I get the next error: Uncaught TypeError: Object #about has no method 'stop' Uncaught SyntaxError: Illegal return statement
I realize that stop() shouldn't be there, but, against all logic, that's the only thing that fixes the flickering.
Can anyone tell me what I'm doing wrong here? :/ Thanks in advance.