jquery: hashchange, prevent jumping to hash

Question

I have a hashchange function set up to show/hide different sections of an about page without having 7 separate pages. This all works fine, great infact, there's just one small thing that's bothering me, when the relevant content is shown on screen, eg: `#about01` if you click on the menu button again the browser jumps down to the top of this div, which I don't want to happen. Here's my jQuery: ``` jQuery(document).ready(function(){ jQuery(window).on('hashchange', function(){ var hashFound = determineContent(); if(hashFound) return false; }); function determineContent(){ var hash = window.location.hash; jQuery('.about').hide(); jQuery('.sub-menu').each(function(){ if (jQuery(this).attr('hook') === hash.replace('#about', '')) { jQuery('#about'+jQuery(this).attr('hook')).fadeIn(); return true; } }); jQuery('html, body').animate({scrollTop:0}, 'slow'); return false; } determineContent(); }); ``` HTML: ```

Accepted Answer

problem is in your jquery.each block.

"return true" inside jquery.each block will not return but continue for next items. Also, this will not return from your determineContent function, so the next code for scroll will also be executed and determineContent will always return false.

use a flag e.g.

```
var found = false;
JQuery.each(function(){
   if(found) return;
   //if your condition is true then found = true
})

if(found) return true;
//else continue the next line.
```

jquery: hashchange, prevent jumping to hash

Solution

Problem