advanced code snippet search

Posted By

mikemetcalf on 10/12/09


Tagged

list content nav swap


Versions (?)

Who likes this?

2 people have marked this snippet as a favorite

karp13
wirenaught


Content Swap

 / Published in: jQuery
 

What it does: Takes a navigation, and swaps out corresponding content dynamically. It will automatically assign an .active class to the active list item, and unhide the first hidden div.

How it works: Add '.swap' to the navigation ul. Add a '.hidden' class to each one of the corresponding divs

Expand | Embed | Plain Text 
  1. $('ul.swap li:first-child').addClass('active');
  2. $('div.hidden:eq(0)').show();
  3. $('ul.swap a').click(function(){
  4. 	var $this = $(this);
  5. 	$('ul.swap li').removeClass('active');
  6. 	$('div.hidden').hide();
  7. 	$($this.attr('href')).fadeIn();
  8. 	$this.parent().addClass('active');
  9. 	return false;
  10. });

Report this snippet  

You need to login to post a comment.