Return to Snippet

Revision: 35086
at November 2, 2010 08:38 by chrislorenz


Updated Code
/* Author: Verve! Community Builders */

$(document).ready(function (){
	var prevNav;
	var prevId;

	
	if ($('#servicesContent').length) {
	
		function servicesSelect($id, $prevId, $navId, $prevNavId) {
			// Debug alert(prevNav+" : "+prevId);
			$("#"+$prevNavId).css("background-image", "url(/images/services/"+$prevNavId+"_off.png)");
			$("#"+$navId).css("background-image", "url(/images/services/"+$navId+"_on.png)");
			$($prevId).fadeOut('slow', function(){
				$($id).fadeIn('slow');
				});
			$($prevId+"Head").fadeOut('slow', function(){
				$($id+"Head").fadeIn('slow', function() {
					});
				});

		}
		

		if(prevNav == undefined){
			servicesSelect('#servicesContent1', '#servicesContent1', 'strategyLink', 'strategyLink');
			prevNav = 'strategyLink';
			prevId = '#servicesContent1';
		}
		
		$('.serviceClick').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
});

Revision: 35085
at November 2, 2010 08:37 by chrislorenz


Updated Code
/* Author: Verve! Community Builders */
/* Todo: change click actions to class, reduce code */

$(document).ready(function (){
	var prevNav;
	var prevId;

	
	if ($('#servicesContent').length) {
	
		function servicesSelect($id, $prevId, $navId, $prevNavId) {
			// Debug alert(prevNav+" : "+prevId);
			$("#"+$prevNavId).css("background-image", "url(/images/services/"+$prevNavId+"_off.png)");
			$("#"+$navId).css("background-image", "url(/images/services/"+$navId+"_on.png)");
			$($prevId).fadeOut('slow', function(){
				$($id).fadeIn('slow');
				});
			$($prevId+"Head").fadeOut('slow', function(){
				$($id+"Head").fadeIn('slow', function() {
					});
				});

		}
		

		if(prevNav == undefined){
			servicesSelect('#servicesContent1', '#servicesContent1', 'strategyLink', 'strategyLink');
			prevNav = 'strategyLink';
			prevId = '#servicesContent1';
		}
		
		$('.serviceClick').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
});

Revision: 35084
at November 2, 2010 08:34 by chrislorenz


Updated Code
/* Author: Verve! Community Builders */
/* Todo: change click actions to class, reduce code */

$(document).ready(function (){
	var prevNav;
	var prevId;

	
	if ($('#servicesContent').length) {
	
		function servicesSelect($id, $prevId, $navId, $prevNavId) {
			// Debug alert(prevNav+" : "+prevId);
			$("#"+$prevNavId).css("background-image", "url(/images/services/"+$prevNavId+"_off.png)");
			$("#"+$navId).css("background-image", "url(/images/services/"+$navId+"_on.png)");
			$($prevId).fadeOut('slow', function(){
				$($id).fadeIn('slow');
				});
			$($prevId+"Head").fadeOut('slow', function(){
				$($id+"Head").fadeIn('slow', function() {
					});
				});

		}
		

		if(prevNav == undefined){
			servicesSelect('#servicesContent1', '#servicesContent1', 'strategyLink', 'strategyLink');
			prevNav = 'strategyLink';
			prevId = '#servicesContent1';
		}
		
		$('#strategyLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		
		$('#applicationLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		$('#designLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
	}
});

Revision: 35083
at November 2, 2010 08:09 by chrislorenz


Updated Code
/* Author: Verve! Community Builders */
$(document).ready(function (){
	var prevNav;
	var prevId;

	
	if ($('#servicesContent').length) {
	
		function servicesSelect($id, $prevId, $navId, $prevNavId) {
			// Debug alert(prevNav+" : "+prevId);
			$("#"+$prevNavId).css("background-image", "url(/images/services/"+$prevNavId+"_off.png)");
			$("#"+$navId).css("background-image", "url(/images/services/"+$navId+"_on.png)");
			$($prevId).fadeOut('slow', function(){
				$($id).fadeIn('slow');
				});
			$($prevId+"Head").fadeOut('slow', function(){
				$($id+"Head").fadeIn('slow', function() {
					});
				});

		}
		

		if(prevNav == undefined){
			servicesSelect('#servicesContent1', '#servicesContent1', 'strategyLink', 'strategyLink');
			prevNav = 'strategyLink';
			prevId = '#servicesContent1';
		}
		
		$('#strategyLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		
		$('#applicationLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		$('#designLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
	}
});

Revision: 35082
at November 2, 2010 08:09 by chrislorenz


Initial Code
/* Author: Verve! Community Builders */
$(document).ready(function (){
	var prevNav;
	var prevId;

	
	if ($('#servicesContent').length) {
	
		function servicesSelect($id, $prevId, $navId, $prevNavId) {
			// Debug alert(prevNav+" : "+prevId);
			$("#"+$prevNavId).css("background-image", "url(/images/services/"+$prevNavId+"_off.png)");
			$("#"+$navId).css("background-image", "url(/images/services/"+$navId+"_on.png)");
			$($prevId).fadeOut('slow', function(){
				$($id).fadeIn('slow');
				});
			$($prevId+"Head").fadeOut('slow', function(){
				$($id+"Head").fadeIn('slow', function() {
					});
				});

		}
		

		if(prevNav == undefined){
			servicesSelect('#servicesContent1', '#servicesContent1', 'strategyLink', 'strategyLink');
			prevNav = 'strategyLink';
			prevId = '#servicesContent1';
		}
		
		$('#strategyLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		
		$('#applicationLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
		$('#designLink').click(function (e) {
			e.preventDefault();
			servicesSelect($(this).attr('href'), prevId, $(this).attr('id'), prevNav);
			prevId = $(this).attr('href');
			prevNav = $(this).attr('id');
		});
	}
    $(".contact").fancybox({
    	'type': 'iframe',
        'width': 800,
        'height': 600,
        'zoomSpeedIn': 500,
        'zoomSpeedOut': 500,
        'hideOnOverlayClick': false,
        'autoScale'     	: false
        
        });
	
});

Initial URL
http://vervecb.com/services

Initial Description
This is a simple little content fader I created using jQuery. It is very simple and not browser intensive. It utilizes callback functions on the fadeOut to execute the fadeIn of the next content block. To reference the HTML src that goes a long with it, visit here. http://snipplr.com/view/43415/jquery-content-fader-html-src/

Initial Title
jQuery Content Fader

Initial Tags
jquery

Initial Language
jQuery