JQuery ui tabs anchoring, how to prevent it?

Question

I created tab navigation, but every time I try to access a specific div using a URL with a hash #, it will snap to the section, is there anyway to prevent auto-pinning? This happens in FF and IE, but not in Safari.

My code is as follows.
JS:

$("#header").tabs({ fx: { opacity: 'toggle' } }); 

HTML:

 <div id="header"> <ul id="navigation"> <li><a href="#debt" class="debt">Debt</a></li> <li><a href="#car" class="car">Car</a></li> <li><a href="#home" class="home">Home</a></li> <li><a href="#travel" class="travel">Travel</a></li> </ul> <div id="debt">xxx</div> <div id="car">xxx</div> <div id="home">xxx</div> <div id="travel">xxx</div> </div> 

Answer 1

Modern browsers parse '#', followed by some line as an anchor, as you noticed.

There are really two solutions:

• Do not use hashes in your URL

or

• Change the name of your tabs. (car_tab, debt_tab, etc.)

If you change the name of your tabs, you can save your hash address and add JS to display the correct tab.