1

I am trying to set these tabs in bootstrap to active when I am at the specific link page. I am new to web design. Anyone have any idea how to do this? This is my html code.

  <div id="top">
       <ul class="nav nav-tabs">
           <li class="active"><a href="index.php">Home</a></li>
           <li><a href="history.php">History</a></li>
           <li><a href="leader.php">Leaderboard</a></li>
           <li><a href="talk.php">Comments</a></li>
       </ul>
  </div>

2 Answers2

2

Use this javascript to add class of active to the parent li if the href matches the URL of the current page:

<script type="text/javascript">
    jQuery(document).ready(function($){
        var url = window.location.href;
        $('.nav a[href="'+url+'"]').parent().addClass('active');
    });
</script>
user13286
  • 3,027
  • 9
  • 45
  • 100
0

If you are using php, it would be better to do it server-side with PHP than with Javascript...

See this question for one solution

Community
  • 1
  • 1
Schmalzy
  • 17,044
  • 7
  • 46
  • 47