// Create floating layer layer1 = 'FloatCover'; layer2 = 'FloatContainer'; var default_opacity = 80; function setVisible() { obj1 = document.getElementById(layer1); obj2 = document.getElementById(layer2); if (obj1.style.visibility == 'visible'){ setOpacity(layer1,default_opacity); setOpacity(layer2,100); fadeOut(); obj1.style.visibility = 'hidden'; obj2.style.visibility = 'hidden'; }else{ setOpacity(layer1,0); setOpacity(layer2,0); obj1.style.visibility = 'visible'; obj2.style.visibility = 'visible'; if(isIE()) placeThem(); //fixing IE problem when first time showing the fullsize fadeIn(); } //obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible'; } function placeThem() { obj1 = document.getElementById(layer1); obj2 = document.getElementById(layer2); var winW = 630, winH = 460; var theLeft = 0, theTop = 0; if (navigator.appName.indexOf("Microsoft")!=-1) { winW = document.body.clientWidth; winH = document.body.clientHeight; theLeft = document.body.scrollLeft; theTop = document.body.scrollTop; }else{ winW = window.innerWidth; winH = window.innerHeight; theLeft = window.pageXOffset; theTop = window.pageYOffset; } if (obj1.style.visibility == 'visible'){ obj1.style.left = theLeft + 'px' ; obj1.style.top = theTop + 'px' ; obj1.style.width= winW + 'px'; obj1.style.height= winH + 'px'; obj2.style.left = theLeft + 'px' ; obj2.style.top = theTop + 'px' ; obj2.style.width= winW + 'px'; obj2.style.height= winH + 'px'; }else{ obj1.style.left = '0px' ; obj1.style.top = '0px' ; obj1.style.width= winW + 'px'; obj1.style.height= '0px'; obj2.style.left = '0px' ; obj2.style.top = '0px' ; obj2.style.width= winW + 'px'; obj2.style.height= '0px'; } //setTimeout("placeThem()",3); } function fadeIn() { timer = 0; for(i=0; i<= default_opacity; i++){ setTimeout("setOpacity('"+layer1+"',"+(i)+")",timer); setTimeout("setOpacity('"+layer2+"',"+(i/default_opacity*100)+")",timer); timer = timer+5; } } function fadeOut() { timer = 0; for(i=0; i<= default_opacity; i++){ setTimeout("setOpacity('"+layer1+"',"+(default_opacity-i)+")",timer); setTimeout("setOpacity('"+layer1+"',"+((default_opacity-i)*100/default_opacity)+")",timer); timer = timer+5; } } function setOpacity(obj, opacity) { obj = document.getElementById(obj).style; obj.opacity = (opacity / 100); obj.MozOpacity = (opacity / 100); obj.KhtmlOpacity = (opacity / 100); obj.filter = "alpha(opacity=" + opacity + ")"; } function isIE() { if (navigator.appName.indexOf("Microsoft")!=-1){ return true; } return false; } // make sure you set maxWidth to be the max number of pixels you want an image to be wide // use // // to activate the script function resizeImages() { if (document.images.length > 0) //Has images, validate sizes { // edit this variable to set the max width // of images var maxWidth = 400; var imgHeight; var imgWidth; for (var loop = 0; loop < document.images.length; loop++) { imgWidth = document.images[loop].width; if((imgWidth > maxWidth)&&(document.images[loop].name!="GNlogo")){ imgHeight = document.images[loop].height; var imageID = "newImage"+loop; image = new Image(); image = document.images[loop]; newImage = image.cloneNode(true); newImage.setAttribute("id", imageID); // store the origninal height and width newImage.origHeight = image.height; newImage.origWidth = image.width; newImage.width = maxWidth ; //Proportionalize Height newImage.height = image.height*(maxWidth/imgWidth); // get parent node // insert this in a table witha message to click to resize if( parentNode = image.parentNode ){ textMessage = document.createTextNode('Click here for full-size image.'); linker = document.createElement('a'); linker.href = "javascript:showFullImage('"+imageID+"');"; linker.onclick = "showFullImage('"+imageID+"');return false;"; linker.title = 'Click to see image full size.'; linker.appendChild( textMessage ); linker.style.color = '#ffffff'; elem0 = document.createElement("td"); elem0.setAttribute( "align", "center"); elem0.style.background = '#017fba'; elem0.style.color = '#ffffff'; elem0.style.fontWeight = 'normal'; elem0.style.fontSize = '10px'; elem0.style.width='auto'; elem0.style.border='2px solid #017fba'; elem = document.createElement("td"); elem.setAttribute( "align", "center"); elem.style.background = 'none'; elem.style.color = '#017fba'; elem.style.fontWeight = 'normal'; elem.style.fontSize = '10px'; elem.style.width='auto'; elem.style.border='2px solid #017fba'; elem0.appendChild( linker ); //elem.appendChild( document.createElement("br")); elem.appendChild( newImage ); tableRow0 = document.createElement("tr"); tableRow0.appendChild(elem0); tableRow = document.createElement("tr"); tableRow.appendChild(elem); TableElem = document.createElement("table"); TableElem.setAttribute( "border", "0"); TableElem.setAttribute( "cellPadding", "0"); TableElem.setAttribute( "cellSpacing", "0"); TableElem.appendChild( tableRow0 ); TableElem.appendChild( tableRow ); frag = document.createElement("div"); frag.appendChild( TableElem ); if( image.outerHTML ) { image.outerHTML = frag.innerHTML; } else { parentNode.replaceChild( TableElem, image ); } } } } } } // make sure you set maxWidth to be the max number of pixels you want an image to be wide // use // // to activate the script function showFullImage(imageName){ setVisible(); obj = document.getElementById('FloatCell'); iobj = document.getElementById(imageName); obj.innerHTML = '

'; checkSizes(); } function resetFullImage(){ obj = document.getElementById('FloatCell'); image = obj.firstChild; document.getElementById('FloatCell').innerHTML = '

'; if(isIE()) placeThem(); checkSizes(); } function checkSizes(){ document.getElementById('FloatWarning').innerHTML = ''; //document.getElementById('FloatWarning').style.visibility ='hidden'; obj = document.getElementById('FloatCell'); //image = document.getElementsByName('iDisplay'); image = obj.firstChild; /*method 2 works with both ie * safari*/ var winW = 630, winH = 460; var imgW = 0, imgH = 0; var checker = 0; if (navigator.appName.indexOf("Microsoft")!=-1) { winW = document.body.clientWidth; winH = document.body.clientHeight; }else{ winW = window.innerWidth; winH = window.innerHeight; } imgW = winW - 75; imgH = winH - 85; if(image.width > imgW){ if(image.height*imgW/image.width > imgH) checker =+4; else checker =+1; }else if(image.height > imgH) checker =+2; if(checker==1){ image.height = image.height*imgW/image.width; image.width = imgW; document.getElementById('FloatWarning').innerHTML = 'Warning: resize your window to fit image or click here to view it.'; //document.getElementById('FloatWarnign').style.visibility ='inherit'; }else if((checker==4)||(checker==2)){ image.width = image.width* imgH/image.height; image.height = imgH; document.getElementById('FloatWarning').innerHTML = 'Warning: resize your window to fit image or click here to view it.'; //document.getElementById('FloatWarning').style.visibility ='inherit'; } } function setupResizeImages(){ document.body.innerHTML+= "

" + "

" + "" + "" + "

" + "" + "" + "" + "" + "" + "

warning

X

"; obj1 = document.getElementById(layer1).style; obj1.position = 'absolute'; setOpacity(layer1,default_opacity); obj1.visibility = 'hidden'; obj1.width ='100%'; obj1.height ='100%'; obj1.left = '0px'; obj1.top = '0px'; obj1.backgroundColor = '#000000'; obj1.border = '0px solid #000000'; obj1.padding = '10px'; obj2 = document.getElementById(layer2).style; obj2.position = 'absolute'; setOpacity(layer2,100); obj2.visibility = 'hidden'; obj2.width ='100%'; obj2.height ='100%'; obj2.left = '0px'; obj2.top = '0px'; obj2.backgroundColor = 'transparent'; obj2.border = '0px solid #000000'; obj2.padding = '10px'; if (isIE()){ obj1.position = 'absolute'; obj2.position = 'absolute'; }else{ obj1.position = 'fixed'; obj2.position = 'fixed'; } obj3 = document.getElementById('FloatTable1').style; obj3.background= 'transparent'; obj3.width = '100%'; obj3.height ='100%'; obj4 = document.getElementById('FloatTable2').style; obj4.background= 'none'; obj4.width = 'auto'; obj4.height ='auto'; obj5 = document.getElementById('FloatCell').style; obj5.background = '#ffffff'; obj5.border = '2px solid #017fba'; obj5.padding = '10px'; obj5.margin = '10px'; obj5.width = 'auto'; obj5.height ='auto'; obj6 = document.getElementById('FloatClose').style; obj6.background = '#017fba'; obj6.border = '1px solid #ffffff'; obj6.margin = '2px'; obj6.padding = '2px'; obj6.fontWeight = 'bold'; obj6.fontSize = '15px'; obj6.fontFamily = 'Arial, Helvetica, sans-serif'; //obj6.display = 'inline-block'; obj6.color = '#FFFFFF'; obj6.textDecoration = 'none'; obj6.width = '15px'; obj6.height = '15px'; obj6.textAlign = 'center'; obj6.verticalAlign = 'middle'; obj7 = document.getElementById('FloatWarning').style; obj7.background = '#990000'; obj7.border = 'none'; obj7.margin = '2px'; obj7.padding = '2px'; obj7.fontWeight = 'bold'; obj7.fontSize = '12px'; obj7.fontFamily = 'Arial, Helvetica, sans-serif'; //obj7.display = 'inline-block'; obj7.color = '#FFffff'; obj7.textDecoration = 'none'; obj7.height = '15px'; obj7.textAlign = 'left'; obj7.verticalAlign = 'middle'; resizeImages(); /*make correction to make sure the child of FloatCell is an image*/ document.getElementById('FloatCell').innerHTML = "

"; if (isIE()){ window.attachEvent('onscroll',placeThem); window.attachEvent('onresize',resetFullImage); }else window.addEventListener('resize',resetFullImage,false); checkSizes(); }