Learn how to use jQuery at the Blog

Adam Rix « visit

  • Added 6 months ago
  • 72 Lines of Code shown
  • 2 Links of Interest
http://adamrix.com
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 Adam Rix - http://adamrix.com

var imageWidth = 1680;
var imageHeight = 1050;
$(document).ready(function() {
	$('#Statu').hide();
	$('#Spinner').fadeTo(0, 0.33);
	$.preloadCssImages({statusBarEl: '#Status'});
	resizeImage();
	$(window).resize(function(){
	  resizeImage();
	});
	$('#Header a').live('mouseover', function() {
		$('#Content').fadeIn();
		
		$('#Image').mouseover(function() {
			$('#Content').fadeOut();
		})
		return false
	})
	$('#Image a').live('click', function(){
		var path = this.pathname;
		$.address.value(path);  
		return false;
	})
	$.address.change(function(event) {  
		href = event.value;	
		if(href!='/') {
			$('#Spinner').show();
			$.ajax({
			  url: '/ajax'+href,
			  cache: true,
			  success: function(result){
				$('#Container').html(result);
				resizeImage();
				$('#Spinner').hide();
			  }
			});
		}	
	});
	$('#Content .links a').live('click', function(){
		var href = $(this).attr('href');
		$('#Content .description').html('<p>Loading...</p>');
			$.ajax({
			  url: '/ajax'+href,
			  cache: true,
			  success: function(result){
			    $("#Content .description").html(result);
				$("#Content .description").fadeIn();
			  }
			});
		$('#Content .links li').removeClass('selected');
		$(this).parent().addClass('selected');
		return false;
	});
});
function resizeImage() {
	var navWidth = $(window).width();
	var navHeight = $(window).height();
	var navRatio = navWidth / navHeight;
	imageRatio = imageWidth / imageHeight;
	if (navRatio > imageRatio) {
		var newHeight = (navWidth / imageWidth) * imageHeight;
		var newWidth = navWidth;
	} else {
		var newHeight = navHeight;
		var newWidth = (navHeight / imageHeight) * imageWidth;
	}	
	newTop = 0 - ((newHeight - navHeight) / 2);
	newLeft =  0 - ((newWidth - navWidth) / 2);
	$('#Image').css({height: navHeight, width: navWidth});
	$('#Image img').css({height: newHeight, width: newWidth, top: newTop, left: newLeft});
	$('#Image').css({visibility:"visible", display:"block"});
}