$(document).ready(function(){

	var fade_speed = 300; //for pop up and images
	var moving_piece = '#timeline'; //The item I want to move
	var full_size_src = "images/lrg/"; //Source of all the large images


	//Animates when user clicks an image and puts on top of links
    	//Animates when user clicks an image and puts on top of links
	$("#timeline a").click(function(){
		var img_src = $(this).attr("title");
		var next_img = $(this).next().attr("title");
		var prev_img = $(this).prev().attr("title");
		$("#popup").stop().fadeTo(fade_speed, 0.7).fadeIn(0).css({zIndex:"4"});
		$('#img_container').stop().animate({marginLeft:"0"},fade_speed-100).fadeIn(fade_speed+700).css({zIndex:"5"}).empty().append("<img src='"+full_size_src+img_src+'.png'+"' />");
		$('#drop_shadow').stop().animate({marginLeft:"0"},fade_speed-200).fadeIn(fade_speed+1500).css({zIndex:"3"});
		$('#close_btn').stop().animate({marginLeft:"0"},fade_speed+500).fadeIn(fade_speed+500).css({zIndex:"7"});		
		//Closes the pop up and puts the box underneath links
		$('#close_btn').click(function(){
			$('#popup').stop().fadeOut(fade_speed);
			$('#img_container').stop().fadeOut(fade_speed);
			$('#drop_shadow').stop().fadeOut(fade_speed);
			$('#close_btn').stop().fadeOut(fade_speed);
		});
	});
});
<!--
// begin absolutely positioned scrollable area object scripts
// Extension developed by David G. Miles
// Original Scrollable Area code developed by Thomas Brattli -->
function verifyCompatibleBrowser(){
    this.ver=navigator.appVersion
    this.dom=document.getElementById?1:0
    this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
    this.ie4=(document.all && !this.dom)?1:0;
    this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
    this.ns4=(document.layers && !this.dom)?1:0;
    this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
    return this
}
bw=new verifyCompatibleBrowser()


var speed=20

var loop, timer

function ConstructObject(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
    this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
    this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetWidth
    this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetWidth
    this.up=MoveAreaUp;this.down=MoveAreaDown;
    this.MoveArea=MoveArea; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
}
function MoveArea(x,y){
    this.y=y;this.x=x
    this.css.left=this.y
    this.css.top=this.x
}

function MoveAreaDown(move){
	if(this.y>-this.scrollHeight+objContainer.clipHeight){
    this.MoveArea(0,this.y-move)
    if(loop) setTimeout(this.obj+".down("+move+")",speed)
	}
}
function MoveAreaUp(move){
	if(this.y<0){
    this.MoveArea(0,this.y-move)
    if(loop) setTimeout(this.obj+".up("+move+")",speed)
	}
}

function PerformScroll(speed){
	if(initialised){
		loop=true;
		if(speed>0) objScroller.down(speed)
		else objScroller.up(speed)
	}
}

function CeaseScroll(){
    loop=false
    if(timer) clearTimeout(timer)
}
var initialised;
function InitialiseScrollableArea(){
    objContainer=new ConstructObject('timeline_wrapper')
    objScroller=new ConstructObject('timeline','timeline_wrapper')
    objScroller.MoveArea(0,0)
    objContainer.css.visibility='visible'
    initialised=true;
}
// end absolutely positioned scrollable area object scripts -->


