certainlyakey
6/23/2014 - 11:29 AM

Switch between two blocks with a custom link

Switch between two blocks with a custom link

//container should have class `.tabbed`, items - `.tab` and unique classes, link - `.tabbed-link` and should be located inside container
	//Options
	var $tabbed = $('.tabbed');
	var $firstTabName = $('.slided-gallery');
	var secondLinkText = 'К галерее';

	var $visible;
	var $hidden;
	var firstLinkText = $tabbed.find('.tabbed-link').text();
	$tabbed.find('.tab').not(':first').hide();
	$tabbed.find('.tabbed-link').on('click',function(e) {
		e.preventDefault();
		$visible = $tabbed.find('.tab').not(':hidden');
		$hidden = $tabbed.find('.tab:hidden');
		$visible.hide();
		$hidden.show();

		if ($tabbed.find($firstTabName).is(':hidden')) {
			$(this).text(secondLinkText);
		} else {
			$(this).text(firstLinkText);
		}
	});