's used to hold the closebox, image, and zoom shadow.
-
- var inBody = document.getElementsByTagName("body").item(0);
-
- // WAIT SPINNER
-
- var inSpinbox = document.createElement("div");
- inSpinbox.setAttribute('id', 'ZoomSpin');
- inSpinbox.style.position = 'absolute';
- inSpinbox.style.left = '10px';
- inSpinbox.style.top = '10px';
- inSpinbox.style.visibility = 'hidden';
- inSpinbox.style.zIndex = '525';
- inBody.insertBefore(inSpinbox, inBody.firstChild);
-
- var inSpinImage = document.createElement("img");
- inSpinImage.setAttribute('id', 'SpinImage');
- inSpinImage.setAttribute('src', zoomImagesURI+'zoom-spin-1.png');
- inSpinbox.appendChild(inSpinImage);
-
- // ZOOM IMAGE
- //
- // X
- //
-
- var inRow3 = document.createElement("tr");
- inRow3.style.height = '26px';
- inShadowTbody.appendChild(inRow3);
-
- var inCol7 = document.createElement("td");
- inCol7.style.width = '27px';
- inRow3.appendChild(inCol7);
- var inShadowImg7 = document.createElement("img");
- inShadowImg7.setAttribute('src', zoomImagesURI+'zoom-shadow6.png');
- inShadowImg7.setAttribute('width', '27');
- inShadowImg7.setAttribute('height', '26');
- inShadowImg7.style.display = 'block';
- inCol7.appendChild(inShadowImg7);
-
- var inCol8 = document.createElement("td");
- inCol8.setAttribute('background', zoomImagesURI+'zoom-shadow7.png');
- inRow3.appendChild(inCol8);
- // inCol8.innerHTML = ' ';
- var inSpacer5 = document.createElement("img");
- inSpacer5.setAttribute('src',zoomImagesURI+'spacer.gif');
- inSpacer5.setAttribute('height', '1');
- inSpacer5.setAttribute('width', '1');
- inSpacer5.style.display = 'block';
- inCol8.appendChild(inSpacer5);
-
- var inCol9 = document.createElement("td");
- inCol9.style.width = '27px';
- inRow3.appendChild(inCol9);
- var inShadowImg9 = document.createElement("img");
- inShadowImg9.setAttribute('src', zoomImagesURI+'zoom-shadow8.png');
- inShadowImg9.setAttribute('width', '27');
- inShadowImg9.setAttribute('height', '26');
- inShadowImg9.style.display = 'block';
- inCol9.appendChild(inShadowImg9);
- }
-
- if (includeCaption) {
-
- // CAPTION
- //
- //
- // 
- //
-
- var inZoombox = document.createElement("div");
- inZoombox.setAttribute('id', 'ZoomBox');
-
- inZoombox.style.position = 'absolute';
- inZoombox.style.left = '10px';
- inZoombox.style.top = '10px';
- inZoombox.style.visibility = 'hidden';
- inZoombox.style.zIndex = '499';
-
- inBody.insertBefore(inZoombox, inSpinbox.nextSibling);
-
- var inImage1 = document.createElement("img");
- inImage1.onclick = function (event) { zoomOut(this, event); return false; };
- inImage1.setAttribute('src',zoomImagesURI+'spacer.gif');
- inImage1.setAttribute('id','ZoomImage');
- inImage1.setAttribute('border', '0');
- // inImage1.setAttribute('onMouseOver', 'zoomMouseOver();')
- // inImage1.setAttribute('onMouseOut', 'zoomMouseOut();')
-
- // This must be set first, so we can later test it using webkitBoxShadow.
- inImage1.setAttribute('style', '-webkit-box-shadow: '+shadowSettings+'0.0)');
- inImage1.style.display = 'block';
- inImage1.style.width = '10px';
- inImage1.style.height = '10px';
- inImage1.style.cursor = 'pointer'; // -webkit-zoom-out?
- inZoombox.appendChild(inImage1);
-
- var inClosebox = document.createElement("div");
- inClosebox.setAttribute('id', 'ZoomClose');
- inClosebox.style.position = 'absolute';
-
- // In MSIE, we need to put the close box inside the image.
- // It's 2008 and I'm having to do a browser detect? Sigh.
- if (browserIsIE) {
- inClosebox.style.left = '-1px';
- inClosebox.style.top = '0px';
- } else {
- inClosebox.style.left = '-15px';
- inClosebox.style.top = '-15px';
- }
-
- inClosebox.style.visibility = 'hidden';
- inZoombox.appendChild(inClosebox);
-
- var inImage2 = document.createElement("img");
- inImage2.onclick = function (event) { zoomOut(this, event); return false; };
- inImage2.setAttribute('src',zoomImagesURI+'closebox.png');
- inImage2.setAttribute('width','30');
- inImage2.setAttribute('height','30');
- inImage2.setAttribute('border','0');
- inImage2.style.cursor = 'pointer';
- inClosebox.appendChild(inImage2);
-
- // SHADOW
- // Only draw the table-based shadow if the programatic webkitBoxShadow fails!
- // Also, don't draw it if we're IE -- it wouldn't look quite right anyway.
-
- if (! document.getElementById('ZoomImage').style.webkitBoxShadow && ! browserIsIE) {
-
- // SHADOW BASE
-
- var inFixedBox = document.createElement("div");
- inFixedBox.setAttribute('id', 'ShadowBox');
- inFixedBox.style.position = 'absolute';
- inFixedBox.style.left = '50px';
- inFixedBox.style.top = '50px';
- inFixedBox.style.width = '100px';
- inFixedBox.style.height = '100px';
- inFixedBox.style.visibility = 'hidden';
- inFixedBox.style.zIndex = '498';
- inBody.insertBefore(inFixedBox, inZoombox.nextSibling);
-
- // SHADOW
- // Now, the shadow table. Skip if not compatible, or irrevelant with -box-shadow.
-
- //
- //
- // 
- //
- //
- //  |
- // - // |  |
- // - // | - // | - // - - inRow2 = document.createElement("tr"); - inShadowTbody.appendChild(inRow2); - - var inCol4 = document.createElement("td"); - inCol4.setAttribute('background', zoomImagesURI+'zoom-shadow4.png'); - inRow2.appendChild(inCol4); - // inCol4.innerHTML = ' '; - var inSpacer2 = document.createElement("img"); - inSpacer2.setAttribute('src',zoomImagesURI+'spacer.gif'); - inSpacer2.setAttribute('height', '1'); - inSpacer2.setAttribute('width', '1'); - inSpacer2.style.display = 'block'; - inCol4.appendChild(inSpacer2); - - var inCol5 = document.createElement("td"); - inCol5.setAttribute('bgcolor', '#ffffff'); - inRow2.appendChild(inCol5); - // inCol5.innerHTML = ' '; - var inSpacer3 = document.createElement("img"); - inSpacer3.setAttribute('src',zoomImagesURI+'spacer.gif'); - inSpacer3.setAttribute('height', '1'); - inSpacer3.setAttribute('width', '1'); - inSpacer3.style.display = 'block'; - inCol5.appendChild(inSpacer3); - - var inCol6 = document.createElement("td"); - inCol6.setAttribute('background', zoomImagesURI+'zoom-shadow5.png'); - inRow2.appendChild(inCol6); - // inCol6.innerHTML = ' '; - var inSpacer4 = document.createElement("img"); - inSpacer4.setAttribute('src',zoomImagesURI+'spacer.gif'); - inSpacer4.setAttribute('height', '1'); - inSpacer4.setAttribute('width', '1'); - inSpacer4.style.display = 'block'; - inCol6.appendChild(inSpacer4); - - // |
- // | - // |  |
- //
- //
- //
- //
-
- var inCapDiv = document.createElement("div");
- inCapDiv.setAttribute('id', 'ZoomCapDiv');
- inCapDiv.style.position = 'absolute';
- inCapDiv.style.visibility = 'hidden';
- inCapDiv.style.marginLeft = 'auto';
- inCapDiv.style.marginRight = 'auto';
- inCapDiv.style.zIndex = '501';
-
- inBody.insertBefore(inCapDiv, inZoombox.nextSibling);
-
- var inCapTable = document.createElement("table");
- inCapTable.setAttribute('border', '0');
- inCapTable.setAttribute('cellPadding', '0'); // Wow. These honestly need to
- inCapTable.setAttribute('cellSpacing', '0'); // be intercapped to work in IE. WTF?
- inCapDiv.appendChild(inCapTable);
-
- var inTbody = document.createElement("tbody"); // Needed for IE (for HTML4).
- inCapTable.appendChild(inTbody);
-
- var inCapRow1 = document.createElement("tr");
- inTbody.appendChild(inCapRow1);
-
- var inCapCol1 = document.createElement("td");
- inCapCol1.setAttribute('align', 'right');
- inCapRow1.appendChild(inCapCol1);
- var inCapImg1 = document.createElement("img");
- inCapImg1.setAttribute('src', zoomImagesURI+'zoom-caption-l.png');
- inCapImg1.setAttribute('width', '13');
- inCapImg1.setAttribute('height', '26');
- inCapImg1.style.display = 'block';
- inCapCol1.appendChild(inCapImg1);
-
- var inCapCol2 = document.createElement("td");
- inCapCol2.setAttribute('background', zoomImagesURI+'zoom-caption-fill.png');
- inCapCol2.setAttribute('id', 'ZoomCaption');
- inCapCol2.setAttribute('valign', 'middle');
- inCapCol2.style.fontSize = '14px';
- inCapCol2.style.fontFamily = 'Helvetica';
- inCapCol2.style.fontWeight = 'bold';
- inCapCol2.style.color = '#ffffff';
- inCapCol2.style.textShadow = '0px 2px 4px #000000';
- inCapCol2.style.whiteSpace = 'nowrap';
- inCapRow1.appendChild(inCapCol2);
-
- var inCapCol3 = document.createElement("td");
- inCapRow1.appendChild(inCapCol3);
- var inCapImg2 = document.createElement("img");
- inCapImg2.setAttribute('src', zoomImagesURI+'zoom-caption-r.png');
- inCapImg2.setAttribute('width', '13');
- inCapImg2.setAttribute('height', '26');
- inCapImg2.style.display = 'block';
- inCapCol3.appendChild(inCapImg2);
- }
-}
\ No newline at end of file
 |
- // - // |  |
- //