Make Twitter Bootstrap navbar link active

Question

What\'s the standard way to make the active link in a Twitter Bootstrap navbar bolded? It\'s clear that a link gains the active appearance by gaining the \"active\" class. F

Answer 1

Chris Moutray your answer helped me a lot in the develop of my software (i'm using ZendFramework). I wrote this view helper:

<?php

class Zend_View_Helper_ActiveOrNot {

    function activeOrNot ( $requestUri ) { 

        $current_file_name = basename($_SERVER['REQUEST_URI'], ".php");

        if ($current_file_name == $requestUri)

            echo 'class="active"';

    }   

}

In this case i call this helper in the view thus:

<?php $this -> activeOrNot ( "public" );

Thanks U!!

Answer 2

Just put the below code into "head" section.

<script type="text/javascript">
$(document).ready(function () {
$("li a[href='" + location.href.substring(location.href.lastIndexOf("/") + 1, 255) + "']").addClass("active");
});
</script>

obviously don't forget your call to jquery.js before.

And your:

<style>
.active{something...}
</style>

Answer 3

Add the following script at the bottom of the page:

<script>
    $(document).ready(function() {
        var url = this.location.pathname;
        var filename = url.substring(url.lastIndexOf('/')+1);
        $('a[href="' + filename + '"]').parent().addClass('active');
    });
</script>