Changing the hash but not moving the page using jquery ui tabs

Question

I added the following code to change the hash to the tab name:

$(\"#tabs > ul\").tabs({ 
select: function(event, ui){ 
window.location.hash = ui.tab.hash;         


        

Answer 1

If there's an element on the page that has the same id as what you're setting the hash to, for instance you're trying to set the browser hash to #cars and there's already a div#cars on the page, the browser will scroll you down to where that div is.

To my knowledge, there are 3 possible workarounds

1) Change the browser hash to something else such as #thecars.

2) Change your existing markup in some similar manner.

3) On some event, changing the id of your similarly named markup, then changing the browser hash, then rechanging the name of markup back to it's original value should also theoretically work. This is obviously a bad and slow workaround, just thought I'd mention it.