Posted By

amandalaine on 07/08/11


Tagged

simple tabs


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

jillella


Simple Tabs


 / Published in: jQuery
 

The following jquery presumes HTML involving: (contains divs of each tab) (contains divs of each content)

  1. $(document).ready(function() {
  2. // hide all tabbed content other than the first or active div
  3. $("#tabbed_content > div").not(".active").hide();
  4.  
  5. // when user clicks a tab, display the corresponding content
  6. $("#tabs > div").click(function() {
  7. var tab_selected = $(this).index()
  8. $("#tabs > div").removeClass("active")
  9. $(this).addClass("active")
  10. $("#tabbed_content > div")
  11. .hide()
  12. .removeClass("active")
  13. $("#tabbed_content > div:eq("+tab_selected+")")
  14. .show()
  15. .addClass("active")
  16. })
  17. })

Report this snippet  

You need to login to post a comment.