Learn how to use jQuery at the Blog

Scott Darby - Web Designer « visit

  • Added 7 months ago
  • 224 Lines of Code shown
  • 0 Links of Interest
http://scottdarby.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 Scott Darby - Web Designer - http://scottdarby.com

/////////////////
//indent labels//
/////////////////

//indent text
function indentTxt(e){
	$(e).css('textIndent','-9999em');
}

//unindent text
function unIndentTxt(e){
	$(e).css({'textIndent': '0'});
}

function indentAll(){
	//add indentable class to each label that precedes a text input that wants indentin'
	$("input.indent[type=text]").each(function(){
		$(this).prev('label').addClass('indentable');
		//if there is nothing in the input, place label over input	
		if ($(this).val()===''){
			unIndentTxt($(this).prev());
		} else {
		//otherwise remove it
			indentTxt($(this).prev());
		}
		//handle clicking on the label itself
		$(this).prev('label').click(function(){
			indentTxt(this);
			$(this).next().focus();
		});
		//handle form focus
		$(this).focus(function(){
			indentTxt($(this).prev());
		});
		$(this).blur(function(){
			if(this.value===''){
				unIndentTxt($(this).prev());
			}
		});
		//add a text cursor to labels
		$(this).prev('label').mouseover(function () {
			$(this).css('cursor','text');
		});
	});
}

//////////////////
//menu highlight//
//////////////////
jQuery.fn.fader = function() {
    return this.each(function(){

		var $link = $(this);
		
		if (!$link.parent().hasClass('current_page_item')){

			$link.append('<span class="fade-img"></span>');

			$link.children().css('opacity','0');

			$link.hover(
				function(){
					$(this).children().stop().animate({
						opacity: 1
					}, 'slow');
					$(this).css('background','none');
				},
				function(){
					$(this).children().stop().animate({
						opacity: 0
					}, 'slow');
				}
			)
			
		}

    });
};

////////////////////////
//portfolio navigation//
////////////////////////
function slideContent(el){

	$(el).parent().addClass('slideContent');

	clicked = false;

	if (clicked == false){
		selected = 0;
	}

	portfolioLength = $(el).length -1;

	changeSelected(el);

	changeImage('prev', el);
	changeImage('next', el);
}

function changeSelected(el){

	$('.selected').removeClass('selected');

	$(el).eq(selected).addClass('selected');
	
	$('.selected .project-image, .selected h2, .selected .project-details').hide().fadeIn('slow');
	
	timer = setInterval("miniSlideShow()", 4000);
}

function miniSlideShow(){

	var $active = $('.selected .project-image a.active');
	
	if ($active.length == 0) $active = $('.selected .project-image a:last');
	
    var $next = $active.next().length ? $active.next() : $('.selected .project-image a:first');
	
	$active.addClass('last-active');

    $next.hide()
		.addClass('active')
		.fadeIn('slow', function(){
			$active.removeClass('active last-active');
		});
	
    $active.removeClass('active');
		
}

function changeImage(dir, el){

	$('.'+dir+'-project').click(function(){
	
		clearInterval(timer);

		$('.selected h2, .selected .project-details').fadeOut('slow');
	
		$('.selected .project-image').fadeOut('slow', function(){

			if (dir == 'prev'){
				selected--;
			} else {
				selected++;
			}

			if (selected == -1 ){

				selected = portfolioLength;

			} else if (selected > portfolioLength){

				selected = 0;

			}

			clicked = true;

			changeSelected(el);

		});

		return false;

	});
	
}

function replaceLegend(){

	var $legend = $('legend');
	var legendText = $legend.text();
	var $newHeading = $('<h2></h2>');
	
	$newHeading.text(legendText);
	$legend.replaceWith($newHeading);

}

function addTexture(){

	var $wrapper = $('#wrapper');

	if ($wrapper.height() > 1000){
		$wrapper.addClass('textured');
	}

}

function newWindow(){
	$('a[rel="blank"]').attr('target', '_blank');
}

$(document).ready(function(){
	
	//indent labels
	indentAll();
	
	slideContent('#content .portfolio-list li');
	
	//change search box on focus
	$('#s').focus(function(){
		$(this).parent().parent().toggleClass('focussed');
	});
	$('#s').blur(function(){
		$(this).parent().parent().toggleClass('focussed');
	});
	
	replaceLegend();
	
	$('.stats li:last-child').prev().addClass('penultimate');
	
	addTexture();
	
	newWindow();

});

$(window).load(function(){

	$('#primaryNav li a').fader();
	
});