Pages

Thursday, May 5, 2011

Get Active/ Inactive/ Current tabs in Navigation Bar using PHP and jQuery

php Code
Step 1: Get current page URL using PHP

$phpSelf = $_SERVER['REQUEST_URI'];
               
jQuery Code

Step 2: Check whether URL is similar to navigation bar button url, if they are similar we give it as the current active page,
< script type="text/javascript" >
        $(document).ready(function(){
             var root_url = 
"http://localhost";
             var phpSelf = root_url+"<?php echo $phpSelf;?>";
              $("#navigation li").each(function() {
                  var link = $(this).children("a").attr("href");
                  if(phpSelf == link){
                  $(this).addClass("active");
                  }
               });
          });
 < /script > 


Change, 
active 
to your active css class
http://localhost to website root directory

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.