title: how to link through bootstrap tabs
body: <p>Hello the code which i am posting here is just a w3schools example. Its a bootstrap links tabs. All my problem is when i want for example just to link to the second tab i can't i want when i put a link like that <a href="http://127.0.0.1:61330/test2.html#menu2" rel="nofollow">http://127.0.0.1:61330/test2.html#menu2</a>
  i want it to work to go to menu2 section or div what ever but it doesn't work
  i want at the link up tp be like  /test2.html#menu2 /test2.html#menu3 like that but it doesn't happen </p>
  
  <p>i found also this here on stackoverflow but it just show the link up in the browser but when i change the link like <a href="http://127.0.0.1:61330/test2.html#menu3" rel="nofollow">http://127.0.0.1:61330/test2.html#menu3</a> for example it don't work </p>
  
  <pre><code>// Javascript to enable link to tab
  var url = document.location.toString();
  if (url.match('#')) {
      $('.nav-tabs a[href="#' + url.split('#')[1] + '"]').tab('show');
  } 
  
  // Change hash for page-reload
  $('.nav-tabs a').on('shown.bs.tab', function (e) {
      window.location.hash = e.target.hash;
  })
  </code></pre>
  
  <p>main</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;title&gt;Bootstrap Case&lt;/title&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1"&gt;
    &lt;link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div class="container"&gt;
    &lt;h2&gt;Dynamic Tabs&lt;/h2&gt;
    &lt;ul class="nav nav-tabs"&gt;
      &lt;li class="active"&gt;&lt;a data-toggle="tab" href="#home"&gt;Home&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-toggle="tab" href="#menu1"&gt;Menu 1&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-toggle="tab" href="#menu2"&gt;Menu 2&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-toggle="tab" href="#menu3"&gt;Menu 3&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  
    &lt;div class="tab-content"&gt;
      &lt;div id="home" class="tab-pane fade in active"&gt;
        &lt;h3&gt;HOME&lt;/h3&gt;
        &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id="menu1" class="tab-pane fade"&gt;
        &lt;h3&gt;Menu 1&lt;/h3&gt;
        &lt;p&gt;Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id="menu2" class="tab-pane fade"&gt;
        &lt;h3&gt;Menu 2&lt;/h3&gt;
        &lt;p&gt;Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam.&lt;/p&gt;
      &lt;/div&gt;
      &lt;div id="menu3" class="tab-pane fade"&gt;
        &lt;h3&gt;Menu 3&lt;/h3&gt;
        &lt;p&gt;Eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.&lt;/p&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>