CODEWITHSUNDEEP
javascriptjqueryhtmlbookmarks
user644876
user644876

Reputation:

url hash tag to stop scrolling / focusing

Working on a project which uses Jquery(1.6) Tabs, works all good but wondering if there's a way to stop the page focusing on the content div when using the hash tag in the url, its the browsers bookmarking feature i suspect but asking if i can override this, stop it or alternative solutions?

I already have alternative javascript referencing solutions ie make the ids obtuse and re-reference them in an array so when you use a certain hash its translated to "tab1" for example, that bit is easy its questioning whether this is possible via means of simply stopping the auto id focusing.

Example scenario:

  1. Go to www.domain.com/about-us#company-info
  2. www.domain.com/about-us loads and tab "company-info" activates, browser focuses on the div with the same id as the tab which has the content of the tab hiding the whole heading section.

Code is as follows:

<ul>
  <li><a href="#company-info">Company Info</a></li>
  <li><a href="#meet-the-team">Meet the team</a></li>
</ul>

<div id="company-info">
 content here
</div>
<div id="meet-the-team">
content here
</div>

<script>
   var tabs = $("#tabs").tabs({
    select: function(event, ui) {
     window.location.hash = ui.tab.hash;
    }
   });

 if(window.location.hash!=''){
   var param = window.location.hash;
   param = param.replace('#','');
   tabs.tabs('select',param);
 }
</script>

Upvotes: 2

Views: 2502

Answers (1)

Val
Val

Reputation: 17522

var tabs = $("#tabs").tabs({
    select: function(event, ui) {
      event.preventDefault();
      window.location.hash = ui.tab.hash;
      return;
   }
});

I think this should do it .

Upvotes: 1

Related Questions