Geek asks and answers

Remember tab clicked on website

I created my own tabs with hyperlinks and div. im placing them in the sidebar.

im using jquerys.show () and hide () for the corresponding div when the hyperlink is clicked.

However, it works fine, but I would like the last link / tab to be clicked to remember throughout the site when the user navigates.

How can i do this?

+3
source share
3 answers

It is best to use a cookie to store the name of the active tab. Then, when loading the page, check the cookie on JS and use it as the basis for displaying the correct tab and hiding others.

jQuery cookie cookie: http://plugins.jquery.com/project/Cookie

( , ):

MARKUP

<ul id="tabs">
  <li id="tab-a">First tab</li>
  <li id="tab-b">Second tab</li>
  <li id="tab-c">Third tab</li>
</ul>

JAVSCRIPT

//On Window load:
if ($.cookie('activetab')) {
  var activetabId = $.cookie('activetab');
  $('#tabs li').removeClass('active');
  $('#'+activetabId).addClass('active');
}

//On tab click
$('#tabs li')click(function(){
 var id =  $(this).attr('id');
 $.cookie('activetab',id);
});
+3

You can save the id of the tab that was last pressed in the sidebar. eg:.

$("#sidebar").data("lastClickedTab", $("#theTab")[0].id);
+2
source

More articles:


All Articles