Learn how to use jQuery at the Blog

commadelimited « visit

  • Added 8 months ago
  • 69 Lines of Code shown
  • 0 Links of Interest
http://commadelimited.com
Source Code
This is my Source Code and I don't want to show it here
View Source Code only (as overlay) 
// That code snippet belongs to commadelimited - http://commadelimited.com

$(document).ready(function() {

	// load all links in a new window
	$('p a').each(function(){
		$(this).attr('target','_blank');
	});

	// the currently loaded section
	var curLoaded = 'about';

	// start by showing the about us section
	$('#contentContainer').animate({
		height: 625
	},"slow", function(){
		// fade in the content
		$('#' + curLoaded).fadeIn();
	});

	// navigation trigger
	$('#navbar a').each(function() {
		var $this = $(this)
		var target = $this.attr('href').split('#')[1];
		var $contentContainer = $('#contentContainer');
		var oldPos = 201;
		var newPos = 625;

		// add a click handler to each A tag
		$this.click(function(){
			// if the container isn't open, then open it...duh!
			if ($contentContainer.css('height') == '201px') {
				// trigger the animation
				$contentContainer.animate({
					height: newPos
				},"slow", function(){
					// fade in the content
					$('#' + target).fadeIn();
				});
			} else {
				if (curLoaded == target) {
					$contentContainer.animate({
						height: oldPos
					},"slow", function(){
						$('#content div').hide();
					});
				} else {
					$contentContainer.animate({
						height: oldPos
					},"slow", function(){
						$('#content div').hide();
						$contentContainer.animate({
							height: newPos
						},"slow", function(){
							$('#' + target).fadeIn();
						});
					});
				}
			}

			curLoaded = target;

			return false;
		});

	});

	// remove the focus lines
	$('a').focus( function() { $(this).blur(); } );

});