Learn how to use jQuery at the Blog

Toby Braun Information Design « visit

  • Added 6 months ago
  • 199 Lines of Code shown
  • 3 Links of Interest
http://tbid.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 Toby Braun Information Design - http://tbid.com

/* HIDE ACCORDION CONTENT
http://www.learningjquery.com/2008/10/1-awesome-way-to-avoid-the-not-so-excellent-flash-of-amazing-unstyled-content */
$('html').addClass('js'); 

$(document).ready(function()
	{ 	
	
		/* $("img.Png").pngFix(); */
		
/* ENABLE ELEMENTS IF JAVASCRIPT IS TRUE */
		$("a").removeClass("noscriptstyle"); 
		$("hr").remove();
		var bPict = "<IMG ID=\"largeImg\" SRC=\"img/s_RoyalTableUSA-home.jpg\" ALT=\"Sample image placeholder\">";
		$("#bigPict").append(bPict);
		$("#imgCaption").append("<small>Royal Table USA, Home Page: <SPAN CLASS=\"whitey\">Website Design</SPAN></small>");
		$("#vcard").css("opacity",".4");
		
/* PRELOAD */
		$.preload( [ 
			"btn-contactBtn-hover.gif", 
			"icn-vcard-sm-hover.gif", 
			"header-contact-hover.png" 
		], { base: "img/" } );
		
/* HIGHLIGHT HEADER LINKS */
		$("#headImg,#contactImg").hover(
			function () {
				//alert(this);
				var srcHolder = $(this).attr("src").replace( ".png", "-hover.png");
				$(this).attr("src", srcHolder);
		}, 
			function () {
				var srcHolder = $(this).attr("src").replace( "-hover.png", ".png" );
				$(this).attr("src", srcHolder);
			}
		); 
		
/* HIGHLIGHT CONTACT FOOTER LINKS */
		$("#contact-info").hover(
			function () {
				$(this).find("a").css("color","#FFF");
				$("#vcard").css("opacity",".7");
		}, 
			function () {
				$(this).find("a").css("color","#CCC");
				$("#vcard").css("opacity",".4");
			}
		);
		$("#contact-info a").hover(
			function () {
				$(this).css("color","#5a96ff");
		}, 
			function () {
				$(this).css("color","#fff");
			}
		);
		
/* HIGHLIGHT VCARD ICON */
		$("#vcard").hover(
			function () {
				$(this).attr("src","img/icn-vcard-sm-hover.gif")
					.css("opacity","1");
		}, 
			function () {
				$(this).attr("src","img/icn-vcard-sm.gif")
					.css("opacity",".4");
			}
		);
		
/* ACCORDION */
		$("#accordionmenu").accordion( {
			navigation: true,
 			autoHeight: false,
			collapsible: true,
			header: "h1", 
			icons: { "header": "ui-icon-closed", "headerSelected": "ui-icon-open" }
		});
		$("#headLink").click( function () {
			$("div#accordionmenu").accordion( "activate" , 0 );
			$('html,body').animate({scrollTop: 0}, 1000);
			return false;
		});
		$("#quotelink").click( function () {
			$("div#accordionmenu").accordion( "activate" , 4 );
			$('html,body').animate({scrollTop: 0}, 1000);
			return false;
		});
		$("#accordionmenu h1").click( function () {
			$("div#accordionmenu").accordion("activate" , this);/* "activate" , 1 */
			var newtop = $(this).offset().top;
		//	alert( newtop );
			$('html,body').animate({scrollTop: 0}, 1000);
			return false;
		//	return true;
		});
		
// jQuery SmoothScroll http://blog.medianotions.de/en/articles/2009/smoothscroll-for-jquery
		$('a[href*=#]').click(function() {
				// make sure it's the same location 
			if(location.pathname.replace(/^\//,'')==this.pathname.replace(/^\//,'') && location.hostname==this.hostname && this.hash.replace(/#/,''))
			{
				// get parameters
				var hash=this.hash;
				var target=$(hash).offset().top;
				// animate to target and set the hash to the window.location after the animation
				$("html:not(:animated),body:not(:animated)").animate({ scrollTop: target }, 500, function() { location.hash=hash; });
				// cancel default click action
				return false;
			}
		});

	
/* GALLERY */
		var inactiveThumb = ".25"; //INACTIVE THUMB ALSO SET IN STYLESHEET
		
		$(".thumb-img:first").css("opacity","1")
				.css("background", "red")
				.addClass("selected");
		$(".thumbs img").css("background", "black");
		
		$(".thumb-img").hover(function(){
			$(this).css("opacity", "1"); 
		}, function () { 
			if ( $(this).hasClass("selected") ) {
				$(this).css("opacity", "1");
			} else { 
				$(this).css("opacity", inactiveThumb);
			}
		}); 

		$(".thumbs a").click(function(){
			$(".thumbs img").css("background", "black")
				.css("opacity", inactiveThumb)
				.removeClass("selected");
			var largePath = $(this).attr("href");
			var largeAlt = $(this).attr("title")
				.replace( ": ", ": <span class=\"whitey\">" );
			var theImage = $("#largeImg");
			$("#imgCaption").html(largeAlt + "</span>");
			$(this).children("img").css("background", "red")
				.css("opacity", "1")
				.addClass("selected");
			theImage.attr({ src: largePath, alt: largeAlt })
				.hide()
				.css("opacity","1");
 			if (theImage.is(":animated")) {
				theImage.stop().fadeIn(2000); 
			} else {
				theImage.fadeIn(2000); 
			}
			return false;
		});
		
/* SLIDING CONTACT FORM */
		$("#contactLink").click(function(event){
			toggleForm();
			event.preventDefault();
 		 });
		
/* TRAP THE ENTER KEY FOR TEXT FIELDS */
		$("form input[type=text]").bind("keypress", function(e) {
 			var code=e.charCode || e.keyCode;
			return (code==13)?false:true;
		});	
		
/* VALIDATE FORM*/
		$("#mailForm").validate({
			invalidHandler: function(form, validator) {
				var errors = validator.numberOfInvalids();
				$("#sendMail").attr("disabled", ""); // un-disable submit
				if (errors >= 1) {
					//alert(errors);
 				return false;
				} else {
					closeForm();
					//form.submit();
				}
 		}
		 })

}); // CLOSE READYFUNCTION
	
/* CONTACT FORM FUNCTIONS */
function toggleForm(){
	if ($("#contactForm").is(":hidden")) {
			$("#contactForm").slideDown("slow");
			$("#closeLink").show();
	} else {
			$("#contactForm").slideUp("normal");
			$("#closeLink").hide();
	}
}
		
function closeForm(){
	$("#messageSent").text("PROCESSING...");
	setTimeout(" $('#messageSent').text(' '); $('#contactForm').slideUp('normal') ", 1000);
	$("#contactLink").removeClass("closeIt");
	return true;
}