if(window.addEvent){

window.addEvent('domready', function(){

	if($defined($('img_z'))){
	
		adj_w_0 = $('img_z').getStyle('width').toInt() ;
		adj_h_0 = $('img_z').getStyle('height').toInt() ;
		vp = $('contain');
		var myPan = new Drag.Move('img_z',{
		'container':vp
		//style: false
			
		});	
		
		var mySlide = new Slider($('sld_area'), $('sld_knob'), {
			steps: 100,
			offset:-34,
			onChange: function(step){
			
				inc = (step/75 + 1);
	
				adj_w = adj_w_0 * inc;
				adj_h = adj_h_0 * inc;
			
				//Original image size 
				img_h_0 = adj_h_0;
				img_w_0 = adj_w_0;
				img_top = ((-adj_h + adj_h_0)/2);
				img_left = ((-adj_w + adj_w_0)/2);
				
				//Constraint metrics
				con_h_0 = img_w_0;
				con_v_0 = img_h_0;
	
//				if(navigator.appName != 'Microsoft Internet Explorer'){
					con_h = -(adj_w-con_h_0);
					con_v = -(adj_h-con_v_0 );
					con_mid_h = 0;
					con_mid_v = 0;
/*				} else {
					con_h = -(adj_w-con_h_0);
					con_v = -(adj_h-con_v_0);
					con_mid_h =	(adj_w-con_h_0);
					con_mid_v = (adj_h-con_v_0);
				}
*/
				
			$('img_z').setStyle('width', adj_w);
			$('img_z').setStyle('height', adj_h);
			$('img_z').setStyle('top', img_top);
			$('img_z').setStyle('left', img_left);

			var myPan = new Drag.Move('img_z',{
					limit: {x: [(con_h), (con_mid_h)], y: [(con_v), (con_mid_v)]}
				});	
			
				}
			}).set(0);
	
		$('img_z').addEvent('dblclick',function(){
			Slimbox.open($('img_src').innerHTML);
		});
		
		$('sld_msg').set('html','Double-click to view full image.');
		
	}

});


/*This function is used in enabling a drop-down/flyout menu for IE6
 *It is needed because IE6 and below do not support :hover css functionality
 *for elements other than <a>.  Therefor all li:hover css rules must also have a 
 *corresponding class designated to them. 
 *In this script that class is ".over".
 *
 *The script uses the document.all property, which is only available in IE to assign the 
 *mouse events to <li> elements.  
 *Finally the function takes as a parameter a dom element, this should be the parent of the 
 *navigation bar, either the ul tag or the div container.
 */

window.addEvent('domready', function(){

	//allow function to only add mouse events if browser is IE
	if (document.all&&document.getElementById) {
		walking_node = document.getElementById("walking_cradles_div");
		elite_node = document.getElementById("elites_div");
		sport_node = document.getElementById("sports_div");
		classics_node = document.getElementById("classics_div");
		size_node = document.getElementById("shop_by_size_div");
		color_node = document.getElementById("shop_by_color_div");
		
		if(walking_node){
			walking_node.onmouseover=function() {
				this.className+=" over";
			}
			walking_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(elite_node){
			elite_node.onmouseover=function() {
				this.className+=" over";
			}
			elite_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(sport_node){
					sport_node.onmouseover=function() {
				this.className+=" over";
			}
			sport_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(classics_node){
					classics_node.onmouseover=function() {
				this.className+=" over";
			}
			classics_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(size_node){
					size_node.onmouseover=function() {
				this.className+=" over";
			}
			size_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(color_node){
					color_node.onmouseover=function() {
				this.className+=" over";
			}
			color_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
	}
});

}//end of if(window.addEvent)
else {

/*This function is used in enabling a drop-down/flyout menu for IE6
 *It is needed because IE6 and below do not support :hover css functionality
 *for elements other than <a>.  Therefor all li:hover css rules must also have a 
 *corresponding class designated to them. 
 *In this script that class is ".over".
 *
 *The script uses the document.all property, which is only available in IE to assign the 
 *mouse events to <li> elements.  
 *Finally the function takes as a parameter a dom element, this should be the parent of the 
 *navigation bar, either the ul tag or the div container.
 */

window.onload = function(){ 

	//allow function to only add mouse events if browser is IE
	if (document.all&&document.getElementById) {
		//get navigation menu parent
		/*navRoot = document.getElementById("nav");
		//get all list items
		liList = navRoot.getElementsByTagName("div");
		//add onmounseover and onmouseout events to each <li>
		//that change the class of the element top .over
		for (i=0; i<liList.length; i++) {
			node = liList[i];
			if (node.nodeName=="LI") {
				node.onmouseover=function() {
					this.className+=" over";
				}
				node.onmouseout=function() {
					this.className=this.className.replace(" over", "");
				}
			}
		}*/
		//Get all divs
		walking_node = document.getElementById("walking_cradles_div");
		elite_node = document.getElementById("elites_div");
		sport_node = document.getElementById("sports_div");
		classics_node = document.getElementById("classics_div");
		size_node = document.getElementById("shop_by_size_div");
		color_node = document.getElementById("shop_by_color_div");
		
		if(walking_node){
			walking_node.onmouseover=function() {
				this.className+=" over";
			}
			walking_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(elite_node){
			elite_node.onmouseover=function() {
				this.className+=" over";
			}
			elite_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(sport_node){
					sport_node.onmouseover=function() {
				this.className+=" over";
			}
			sport_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(classics_node){
					classics_node.onmouseover=function() {
				this.className+=" over";
			}
			classics_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(size_node){
					size_node.onmouseover=function() {
				this.className+=" over";
			}
			size_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
		if(color_node){
					color_node.onmouseover=function() {
				this.className+=" over";
			}
			color_node.onmouseout=function() {
				this.className=this.className.replace(" over", "");
			}
		}
	}
		//enableIESixDropDown("category-nav");
};


}

// SETUPS:
// ===============================

// Set the horizontal and vertical position for the popup

var PositionX = 100;
var PositionY = 100;

// Set these value approximately 20 pixels greater than the
// size of the largest image to be used (needed for Netscape)

var defaultWidth  = 700;
var defaultHeight = 240;

// Set autoclose true to have the window close automatically
// Set autoclose false to allow multiple popup windows

var AutoClose = true;

// Do not edit below this line...
// ================================
if (parseInt(navigator.appVersion.charAt(0))>=4){
var isNN=(navigator.appName=="Netscape")?1:0;
var isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}
var optNN='scrollbars=no,width='+defaultWidth+',height='+defaultHeight+',left='+PositionX+',top='+PositionY;
var optIE='scrollbars=no,width=150,height=100,left='+PositionX+',top='+PositionY;
function popImage(imageURL,imageTitle){
if (isNN){imgWin=window.open('about:blank','',optNN);}
if (isIE){imgWin=window.open('about:blank','',optIE);}
with (imgWin.document){
writeln('<html><head><title>ROS Size Chart</title><style>body{margin:0px;}</style>');writeln('<sc'+'ript>');
writeln('var isNN,isIE;');writeln('if (parseInt(navigator.appVersion.charAt(0))>=4){');
writeln('isNN=(navigator.appName=="Netscape")?1:0;');writeln('isIE=(navigator.appName.indexOf("Microsoft")!=-1)?1:0;}');
writeln('function reSizeToImage(){');writeln('if (isIE){');writeln('window.resizeTo(300,300);');
writeln('width=300-(document.body.clientWidth-document.images[0].width);');
writeln('height=300-(document.body.clientHeight-document.images[0].height);');
writeln('window.resizeTo(width,height);}');writeln('if (isNN){');       
writeln('window.innerWidth=document.images["George"].width;');writeln('window.innerHeight=document.images["George"].height;}}');
writeln('function doTitle(){document.title="'+imageTitle+'";}');writeln('</sc'+'ript>');
if (!AutoClose) writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()">')
else writeln('</head><body bgcolor=000000 scroll="no" onload="reSizeToImage();doTitle();self.focus()" onblur="self.close()">');
writeln('<img name="George" src='+imageURL+' style="display:block"></body></html>');
close();		
}}