<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-us">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"> 
<meta name="Author" content="Justin Bright"> 
<meta name="viewport" content="width=1024">
<meta http-equiv="Content-Language" content="en-us" />
<meta name="ROBOTS" content="ALL" />
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="expires" content="0">
<meta http-equiv="Pragma" content="no-cache">
<link rel="stylesheet" type="text/css" href="/css/print.css" media="print" />
<meta name="keywords" content="keywords" />
<meta name="description" content="description" />

<link rel="stylesheet" href="/css/base.css" type="text/css" charset="utf-8">
<link rel="stylesheet" href="/site.css" type="text/css" charset="utf-8">

<link rel="stylesheet" href="/js/fancybox/jquery.fancybox.css" type="text/css" media="screen">

<script type="text/javascript" src="/js/jquery/jquery.mini.js"></script>
<script type="text/javascript" src="/js/jquery/effects.easing.js"></script>
<script type="text/javascript" src="/js/shadedborder/shadedborder.js"></script>

<script src="/js/coda/jquery.scrollTo-1.4.1-min.js" type="text/javascript"></script>
<script src="/js/coda/jquery.localscroll-1.2.7-min.js" type="text/javascript"></script>
<script src="/js/coda/jquery.serialScroll-1.2.1-min.js" type="text/javascript"></script>

<script type="text/javascript" src="/js/fancybox/jquery.fancybox-1.2.1.pack.js"></script>

<script type="text/javascript" src="/js/fancybox/jquery.pngFix.js"></script>

<script type="text/javascript"> 
	var transBorder = RUZEE.ShadedBorder.create({ corner:8, border:1, shadow:16});
	var transBorder2 = RUZEE.ShadedBorder.create({ corner:8, border:1, edges:"blr", shadow:16 });
</script>

<style type="text/css">
#slider {
  width: 900px;
  margin: 0 auto;
  position: relative;
}

.scroll {
  height: auto;
  overflow: auto;
  position: relative; /* fix for IE to respect overflow */
  clear: left;
  background: #FFFFFF url(images/content_pane-gradient.gif) repeat-x scroll left bottom;
}

.scrollContainer div.panel {
  padding: 20px;
  height: auto;
  width: 858px;
}
.scrollButtons {
  position: absolute;
  top: -60px;
  cursor: pointer;
}

.scrollButtons.left {
  left: -30px;
}

.scrollButtons.right {
  right: -30px;
}
</style>

<style type="text/css">
	/* portfolio */
	#portfolio .goright {width:540px; padding-top:0px; margin-top:40px;}
	#portfolio .goright p {}
	#portfolio .thumbs {float:left; margin-top:0px; width:300px; clear:both; margin-top:40px;}
	#portfolio H2 {float:left; margin-top:0px; padding-top:0px; width: auto;}
	#portfolio A.zoom {border:0px;}
	#portfolio .more {position:relative; top:8px; margin-left:15px; font-size:.9em;}
	
	/* references */
	#references .goright {width:600px; padding-top:5px; margin-top:40px;}
	#references .goright p {}
	#references .thumbs {float:left; margin-top:0px; width:240px; clear:both; margin-top:40px;}
	#references H2 {margin-top:0px; padding-top:0px; width: auto; margin-bottom: 5px;}
	#references .thumbs p {clear:both;}
	
	/* resume */
	#resume .goright {width:650px;}
	
	.steps {float:left; width:auto;}
	.steps LI {font-size:2em; line-height:1.7em;}
</style>

</head>

<body>
<div id="container">
	
		<div id="jnav">

		<a href="#intro" class="selected">Welcome</a>
		<a href="#resume">Resume</a> 
		<a href="#portfolio">Portfolio</a>
		<a href="#references">References</a>
	</div>
	
	<div style="padding:0px 10px; margin:0 auto;">
		<div style="float:right; padding-top:10px; text-align:right; width:180px;">

			<img src="/images/gmail.gif" class="left" />
			<a href="mailto:mine@gmail.com" id="mailme">E-mail me</a>, I'm near a computer, I promise.
		</div>
	
		<div class="roundit2" style="width:310px; height:100px; padding:20px; background-color:darkred; color:white;">
			<h1>Justin Bright</h1>
			<h4>49 E. Burke Ave, Towson, MD 21286</h4>
			<span>Cell: (443) 465-1706 | </span> <span id="myemail">mine@gmail.com</span>

		</div>
	</div>	
	<div id="content" style="margin-top:50px; padding:0px;">
	
	<h1 class="title">Web Marketing, Simplified.</h1>
	
		<div id="slider">
  			<div class="scroll">
				<div class="scrollContainer">
					
      				<div class="panel" id="intro"><ul class="steps">
	<li><b>Step 1</b>: Call me.</li>

	<li><b>Step 2</b>: Tell me your goals.</li>
	<li><b>Step 3</b>: Consider it <em>done</em>.</li>
</ul>
<p style="font-size:1.2em; float:right; width:420px; color:black;">With over <b>10 years</b> of web marketing and development experience, I'm going to drive your online business goals; e-commerce, search optimization, database integration, better programming, usability, or whatever they may be. Stop wasting time doing the same 'ol things, call me and let's try something new. <a href="#resume" class="more">check my resume</a></p></div>

      				<div class="panel" id="resume">		
		<h2>A Quick Intro</h2>
		<div class="goright">
		<p>I can already see your eyes glazing over, so I hope this helps you make the decision to <em style="font-weight:bold;">at least</em> get me on 
		the phone; a conversation goes a long way. So here it goes.</p>
		<p style="background-color:#ffffe9; padding:20px; font-size:1.2em;">I'm personable, completely driven to make 
		things work better online for everybody (to the most advanced web dork, down to my "technology-confuses-me" mother), 
		and I <em>love</em> a challenge.</p>

		<p>
		So there, nice and easy -- call me so we can see if I'd be a good fit for your company and maybe you'll say, 
		"Hey, cool, this guy's serious about <em>driving</em> our web marketing activities," cause I am...and I will. </p>
		</div>
	
		<h2>Qualifications</h2>
		<div class="goright">
		<ul class="square">

			<li><strong>10 years of web marketing and development experience</strong> with the 2nd largest US speaker manufacturer, consistently increasing traffic and creating exciting, engaging content with a limited budget and few resources. Managed a web team and reported directly to the Senior VP of Marketing.</li>
			<li>Responsible for developing and executing direct-to-consumer messaging strategies, specifically through online channels.</li>
			<li>Helped grow online sales from <strong>$100k per year to over $2 million and growing</strong>.</li>
			<li>Currently finishing my Master's Degree in Applied Information Technology from Towson University's College of Graduate Studies. I currently have a BS in Physics, with concentrations in Computer Science, from Towson University.</li>
			<li>Organized, focused and passionate about pushing the limits of online marketing to create new sales growth both offline and on the web.</li>

		</ul>
		</div>
		
		<h2>Work Experience</h2>
		<div class="goright">
				<div class="grayit">
		<div class="grid2col">
			<div class="column first">
				<h3>Web Marketing Manager</h3>

				<a href="http://www.polkaudio.com/" target="_new">Polk Audio</a>, Inc
			</div>
			<div class="column last">
				<em>2007 - 2009</em><br>
				Baltimore, MD
			</div>
		</div>
		</div>
		
		<h4>Main Objectives</h4>

		<p>Key member of the Direct Sales Team, created in 2007 and tasked with developing a viable direct-to-consumer sales and e-commerce business model for our brand, which included:</p>
		<ul class="square">
			<li>Creating, implementing and streamlining in-house operations to facilitate all direct-to-consumer fulfillment, from order processing to shipping out of our San Diego warehouse.</li>
			<li>Developing a "no-touch" automation of accommodation web sales, flowing orders from an online web site, created and managed in-house, to integrate with our <a target="_new" href="http://www.epicor.com">internal ERP software system</a> for processing and fulfillment.</li> 
			<li>An official eBay direct store management system that would tie into our web fulfillment process, without relying on costly 3rd party solutions.</li> 
		</ul>

		
		<h4>Notable Accomplishments</h4>
		<ul class="square" style="margin-top:0px;">
			<li>Redesigned the corporate website to align with our direct sales plan, increasing web sales from 100k per year to $2 million a year and growing.</li>
			<li>Managed a web team comprising of a web programming developer, copy writer and <a target="_new" href="http://www.rimmkaufman.com/">paid search marketing</a> consulting firm. Together we executed many online marketing activities and grew our online sales exponentially.</li>
			<li>Met and exceeded expectations of creating a sustainable e-commerce business model for direct-to-consumer sales with proven results from measured performance metrics.</li>

		</ul>
		</p>
		
				<div class="grayit">
		<div class="grid2col">
			<div class="column first">
				<h3>Webmaster / Webguy</h3>
				<a href="http://www.polkaudio.com/" target="_new">Polk Audio</a>, Inc
			</div>

			<div class="column last">
				<em>2001 - 2007</em><br>
				Baltimore, MD
			</div>
		</div>
		</div>
		
		<h4>Goals and Accomplishments (2005 - 2007)<br>
		<span>codename: <em>the webguy</em></span></h4>

		<p>Leverage the website by marketing select products on a direct-to-consumer basis by:</p>
		<ul class="square">
			<li>Speaking directly to consumers through email marketing campaigns and increased targeted banner advertising.</li>
			<li>Re-brand the corporate site to align with traditional marketing efforts and goals, specifically giving the website a "voice" that talks to customers in an engaging and empowering way.</li> 
			<li>Worked closely with the Senior VP of Marketing to coordinate print advertisement campaigns with trackable, response-based websites.</li> 
		</ul>
		
		<h4>Goals and Accomplishments (2001 - 2005)<br>

		<span>codename: <em>webmaster</em></span></h4>
		<p>Built and managed the corporate marketing website from the ground up, organized and consolidated product information for collaboration using online tools, and created a dynamic and useful website that engaged customers by:</p>
		<ul class="square">
			<li>Developing and programming a completely database driven website with a custom in-house Content Management System that featured a specs editor, product editor, system builder and many other tools for "non-technical" employees to contribute to the website -- with virtually zero overhead costs.</li>
			<li>Moved the company forward with community based web applications (forums, customer reviews), created an intuitive and easy to use product registration system, and built interactive web tools to help customers learn and inform themselves before walking into a retail location.</li> 
			<li>Monitored and reported site statistics and metrics. We used these metrics to improve customer usability, enhance dealer and sales support, and streamline performance of content delivery.</li> 
		</ul>

		</p>
		</div>
		
		<h2>A Few Other Jobs</h2>
		<div class="goright">
		If you're interested in jobs I had over 10+ years ago, click <a id="morejobs" href="#">here</a>.
		</div>
		<div class="goright" id='morejobstoggle'>
				<div class="grayit">

		<div class="grid2col">
			<div class="column first">
				<h3>Engineering / Marketing Intern</h3>
				<a href="http://www.polkaudio.com/" target="_new">Polk Audio</a>, Inc
			</div>
			<div class="column last">
				<em>1999 - 2001</em><br>
				Baltimore, MD
			</div>

		</div>
		</div>
		<p>I started out at Polk with a passion for acoustical engineering. But once I started, I realized my interests and skills were best suited in an area I could see direct results. So after a while I started working in the Marketing department and really found something to be excited about. Most importantly, Polk gave me the opportunity to learn and innovate with a team of talented co-workers.</p>
		
				<div class="grayit">
		<div class="grid2col">
			<div class="column first">
				<h3>Inventory Manager</h3>
				<a href="http://www.nist.gov/" target="_new">Nation Institute of Standards and Technology</a>

			</div>
			<div class="column last">
				<em>1996 - 1999</em><br>
				Gaithersburg, MD
			</div>
		</div>
		</div>
		<p>NIST offered me a good opportunity to learn about all the ins-and-outs of government research. Fortunately I learned that government work was not for me.</p>

		</div>
		
		
				<h2>More Stuff You Might Want To Know</h2>
		<div class="goright">
		<ul class="square">
			<li>I started as a programmer, so I'm obsessed about details. Go ahead, take a peek the source code of this page. I code everything by hand, you'll never catch me using a WYSIWYG editor.</li>
			<li>I constantly have ideas, and I like to be creative. Some are great, others stink. The best part about web marketing is the ability to come up with new ways to engage customers online, while still having a <em>plethora</em> of other great tools at our disposal.</li>

			<li>"Prove it." That's something I hear a lot, which is why I've spent hours exploring and fine tuning analytics tools like <a href="http://www.webtrends.com/">WebTrends</a>, <a href="http://www.google.com/analytics/">Google Analytics</a> and <a href="https://www.google.com/analytics/siteopt/splash">Google Optimizer</a>.</li>
			<li>I worked at an audio company for 10 years, <em>of course</em> I like music.</li>
		</ul>

		</div>
		
				<h2>References</h2>
		<div class="goright">
		<p>I've had the amazing opportunity to work with some great minds over the years. Here's are a few people that I've learned a great deal from along the way that were kind enough to write about our professional work experiences together.</p>
		<ul>
			<li><a href="">Dan Hodgson</a> - Senior VP, Strategic Planning at Crutchfield Corporation</li>

			<li><a href="">Ben Newhall</a> - Senior VP, Sales and Marketing at Polk Audio</li>
			<li><a href="">Joe Tristani</a> - Chief Financial Officer at Polk Audio</li>
			<li><a href="">Melanie Szvitich</a> - Director of IT and Direct Sales Operations at Polk Audio</li>
		</ul>

		</div>
</div>
      				<div class="panel" id="portfolio">
		
				<div class="thumbs" style="margin-top:0px;">
			<a rel="group1" href="/images/polkhome-large.gif" title="Polk Audio homepage." class="zoom"><img src="/images/polkhome.gif" /></a>
			<a rel="group1" href="/images/polkproduct-large.gif" title="Example of product page layout." class="zoom"><img src="/images/polkproduct.gif" /></a><br>
			<a rel="group1" href="/images/polkbasket-large.gif" title="Shopping cart page, with refinments to confidence and security to help convert potential customers." class="zoom"><img src="/images/polkbasket.gif" /></a>
			<a rel="group1" href="/images/polkadmin-large.gif" title="Polk custom content management system, campaign reporting example shown (custom built)." class="zoom"><img src="/images/polkadmin.gif" /></a>
		</div>

		
		<div class="goright" style="margin-top:0px;">
			<h2>polkaudio.com</h2><a class="more" target="_new" href="http://www.polkaudio.com/">visit site</a>
			<p style="clear:both">The main focus of my professional career has been spent working with <a target="_new" href="http://www.polkaudio.com">polkaudio.com</a>. Through the years, polkaudio.com has gone through many transitions and changes. I had the opportunity to learn what works and what doesn't, with an average audience of <b>12,000</b> <a target="_new" href="http://www.google.com/support/analytics/bin/answer.py?hl=en&answer=33087">unique daily visitors</a>, and a community of <b>61,712</b> <a target="_new" href="http://www.polkaudio.com/forums/">forum members</a> (and growing) that would email me daily. Believe me, when something didn't work (user interface problems, confusion over application functionality, even broken links), I knew about it.</p>

			<p>This type of environment fast-tracked my working knowledge of the way users engage in websites; through learning, searching, contributing and buying, I've tweaked every inch of polkaudio.com to meet a wide range of different objectives as effectively as possible.</p>
		</div>
		
				<div class="thumbs">
			<a rel="group1" href="/images/zachsowers-large.gif" title="This is the update section. I used a SQL database to store each update." class="zoom"><img src="/images/zachsowers.gif" /></a>
			<a rel="group1" href="/images/zachsowerscontact-large.gif" title="This section gave thousands of voices to the website and created a community of support." class="zoom"><img src="/images/zachsowerscontact.gif" /></a>
		</div>
		<div class="goright">
			<h2>zachsowers.com</h2><a class="more" target="_new" href="http://www.zachsowers.com/">visit site</a>

			<p style="clear:both">My close personal friend, Zach Sowers, was involved in a horrible and senseless act of violence on his way home one night. Through the entire painful months after his attack, I created and maintained <a target="_new" href="http://www.zachsowers.com/">zachsowers.com</a> to update close personal friends and family of his recovery progress. Tragically, Zach passed away as a result of his injuries.</p>
			
			<p>His wife Anna Sowers has used zachsowers.com to <b>reach out to thousands</b> of people and she has taken over updating it and driving public awareness to serious problems of our legal system. She's coordinated <a target="_new" href="http://www.zachsowers.com/NNO2.php">local fundraisers</a>, published articles, contacted local officials and has been in the spotlight to fight for the rights and safety of everyone in Baltimore. There's also a <a target="_new" href="http://www.zachsowers.com/comments.php">section for support and comments</a> that has now been a source of political debate and discussion.</p>

		</div>
		
				<div class="thumbs">
			<a rel="group1" href="/images/ssphome-large.gif" title="Self Storage Plus redesigned homepage." class="zoom"><img src="/images/ssphome.gif" /></a>
			<a rel="group1" href="/images/sspmaps-large.gif" title="Easy to use location finder, integrated with Google Maps." class="zoom"><img src="/images/sspmaps.gif" /></a>
		</div>
		<div class="goright">
			<h2>selfstorageplus.com</h2><a class="more" target="_new" href="http://www.selfstorageplus.com/">visit site</a>
			<p style="clear:both">Self Storage Plus is one of DelMarVa's most successful franchise businesses, with locations throughout the area. They needed a web hosting and design solution that would simplify their customer interaction. I created an <a href="http://www.selfstorageplus.com" target="_new">interactive website</a> that streamlines the customer's Self Storage Plus experience; simplifying the choice of location with intuitive Google Maps location finder, the choice of storage units based on size, location and price, and the reservation process. It even delivers online-only specials that drive business.</p>

		</div>
		
				<div class="thumbs">
			<a rel="group1" href="/images/maxsphotos-large.gif" title="Complete photo gallery, built for Max's employees to update themselves." class="zoom"><img src="/images/maxsphotos.gif" /></a>
			<a rel="group1" href="/images/maxslist-large.gif" title="Beer list, built with SQL backend database." class="zoom"><img src="/images/maxslist.gif" /></a>
		</div>
		<div class="goright">
			<h2>maxs.com</h2><a class="more" target="_new" href="http://www.maxs.com/">visit site</a>
			<p style="clear:both">Max's Taphouse is a Baltimore legend; the anchor for the bustling, historic Fells Point neighborhood of small pubs and restaurants. With the largest beer selection on the East Coast, Max's Taphouse needed a website that could catalog and print their beer lists with easy-to-use, internal database administration. The same admin-friendly database allows the party animals at Max's to upload images from festivals and events the very next day, and to keep in constant contact with their growing email list of beer lovers. This massive renovation of an antiquated site into a deep powerhouse of marketing raises the stakes in the web development of Fells Point!</p>

		</div>
		
				<div class="thumbs">
			
		</div>
		<div class="goright">
			<h2>Need more examples?</h2>
			<p style="clear:both">I've worked with several dozens of professional websites, working with Flash, HTML, PHP & MySQL, 
			JavaScript, ASP and PERL scripting languages. If you're looking for something you don't see here, email or call me and 
			I'd be happy to send you some more examples.</p>
		</div>

		
</div>
      				<div class="panel" id="references">		<div class="thumbs">
			<h2>Dan Hodgson</h2>
			<p><b>Senior VP, Strategic Planning</b><br>
			Crutchfield Corporation</p>
		</div>
		<div class="goright">

			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		</div>
		
				<div class="thumbs">
			<h2>Ben Newhall</h2>
			<p><b>Senior VP, Sales and Marketing</b><br>
			Polk Audio</p>
		</div>

		<div class="goright">
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		</div>
		
				<div class="thumbs">
			<h2>Joe Tristani</h2>
			<p><b>Chief Financial Officer</b><br>
			Polk Audio</p>

		</div>
		<div class="goright">
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		</div>
		
				<div class="thumbs">
			<h2>Melanie Szvitich</h2>
			<p><b>Director of IT and <br>

			Direct Sales Operations</b><br>
			Polk Audio</p>
		</div>
		<div class="goright">
			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		</div>
</div>
      				<div class="panel" id="ideas"></div>

      				
   				 </div>
  			</div>
		</div>	
			
	</div>
	
</div>
</body>



<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
	
	transBorder.render($('.roundit'));
	transBorder2.render($('.roundit2'))
	$("#myemail").text($("#myemail").text().replace(/mine/, 'thefastlane'));
	$("#mailme").attr("href",$("#mailme").attr("href").replace(/mine/, 'thefastlane'));
	$("#morejobstoggle").slideToggle("slow");
	$("#morejobs").click(function () {
      $("#morejobstoggle").slideToggle("slow");
      return false;
    });
    $(".roundit2").slideDown(800, 'easeOutBack');
    
    $("#portfolio a.zoom").fancybox({
		'overlayShow':	true,
		'overlayOpacity': '0.8',
		'zoomSpeedIn':	800, 
		'zoomSpeedOut':	300,
		'easingIn': 'easeOutQuad'
	});
    
var $panels = $('#slider .scrollContainer > div');
var $container = $('#slider .scrollContainer');

// if false, we'll float all the panels left and fix the width 
// of the container
var horizontal = true;

// float the panels left if we're going horizontal
if (horizontal) {
  $panels.css({
    'float' : 'left',
    'position' : 'relative' // IE fix to ensure overflow is hidden
  });
  
  // calculate a new width for the container (so it holds all panels)
  $container.css('width', $panels[0].offsetWidth * $panels.length);
}

// collect the scroll object, at the same time apply the hidden overflow
// to remove the default scrollbars that will appear
var $scroll = $('#slider .scroll').css('overflow', 'hidden');

// apply our left + right buttons
$scroll
  .before('<img class="scrollButtons left" src="/js/fancybox/fancy_left.png" />')
  .after('<img class="scrollButtons right" src="/js/fancybox/fancy_right.png" />');

// handle nav selection
function selectNav() {
  $(this)
    .parents('div')
      .find('a')
        .removeClass('selected')
      .end()
    .end()
    .addClass('selected');
}

function changeTitle(name){
	switch (name) {
		case 'resume':
			name = "R&#233;sum&#233;"; break;
		case 'portfolio':
			name = "Portfolio"; break;
		case 'references':
			name = "References"; break;
		case 'ideas':
			name = "Ideas"; break;
		default:
			name = "Web Marketing, Simplified.";
	}
	$(this)
	  .fadeOut("fast",function(){
	  	$(this).html(name)
	  	  .fadeIn("slow");
	})
}

$('#jnav').find('a').click(selectNav);

// go find the navigation link that has this target and select the nav
function trigger(data) {
  var el = $('#jnav').find('a[href$="' + data.id + '"]').get(0);
  selectNav.call(el); 
  changeTitle.call($(".title"),data.id); 
}

if (window.location.hash) {
  trigger({ id : window.location.hash.substr(1) });
} else {
  $('#jnav a:first').click();
}

// offset is used to move to *exactly* the right place, since I'm using
// padding on my example, I need to subtract the amount of padding to
// the offset.  Try removing this to get a good idea of the effect
var offset = parseInt((horizontal ? 
  $container.css('paddingTop') : 
  $container.css('paddingLeft')) 
  || 0) * -1;


var scrollOptions = {
  target: $scroll, // the element that has the overflow
  
  // can be a selector which will be relative to the target
  items: $panels,
  
  navigation: '#jnav a',
  
  // selectors are NOT relative to document, i.e. make sure they're unique
  prev: 'img.left', 
  next: 'img.right',
  
  // allow the scroll effect to run both directions
  axis: 'xy',
  
  onAfter: trigger, // our final callback
  
  offset: offset,
  
  // duration of the sliding effect
  duration: 800,
  
  // easing - can be used with the easing plugin: 
  // http://gsgd.co.uk/sandbox/jquery/easing/
  easing: 'easeOutBack'
};

// apply serialScroll to the slider - we chose this plugin because it 
// supports// the indexed next and previous scroll along with hooking 
// in to our navigation.
$('#slider').serialScroll(scrollOptions);

// now apply localScroll to hook any other arbitrary links to trigger 
// the effect
$.localScroll(scrollOptions);

// finally, if the URL has a hash, move the slider in to position, 
// setting the duration to 1 because I don't want it to scroll in the
// very first page load.  We don't always need this, but it ensures
// the positioning is absolutely spot on when the pages loads.
scrollOptions.duration = 1;
$.localScroll.hash(scrollOptions);

});
</script>	

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>

<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-512286-3");
pageTracker._trackPageview();
} catch(err) {}</script>
</html>