// // // // // // // function lightBoxGallery3(lightboxvariable, imgSrc,closeImgSrc,lightBoxColor,previousButtonImgSrc,nextButtonImgSrc,txtClass) { //uebernahme aus uebergebener Variable in lightBoxGalleryData //External text data var lightBoxDataElement = getLightBoxGalleryData(lightboxvariable); var imageArray = getLightBoxImages(imgSrc,lightBoxDataElement); //alert(lightBoxDataElement.arrayBildText[0]); var darkLayer = document.createElement('div'); var bodyElement = document.getElementsByTagName("body"); var paddingValue = 10; bodyElement[0].style.cursor = "wait"; var imgElement = new Image(); imgElement.src = imgSrc; imgElement.className='lightBoxGallery3img'; var closeImgElement = new Image(33,33); closeImgElement.src = closeImgSrc; closeImgElement.style.cursor = "pointer" ; var previousButtonImgElement = new Image(28, 57); previousButtonImgElement.src = previousButtonImgSrc; previousButtonImgElement.style.cursor = "pointer" ; var nextButtonImgElement = new Image(28, 57); nextButtonImgElement.src = nextButtonImgSrc; nextButtonImgElement.style.cursor = "pointer" ; var bigDiv = document.createElement('div'); bigDiv.className='lightBoxGallery3'; bigDiv.style.zIndex = 303; bigDiv.style.position = "absolute"; bigDiv.style.backgroundColor = 'white'; bigDiv.style.border = '1px solid silver'; bigDiv.style.padding = paddingValue + 'px'; var index = imgElement.src.lastIndexOf("/"); var tempStr = imgElement.src.substring(index+1,imgElement.src.length); var numericId = tempStr.replace(/[^0-9]/g,''); var txtElement = document.createElement('text'); txtElement.innerHTML = lightBoxDataElement.arrayBildText[(numericId)-1]; var emptyTxtElement = document.createElement('text'); emptyTxtElement.innerHTML = ""; //Set a CSS Class for TXT Element if(txtClass) { txtElement.className = txtClass; } var tbElement = document.createElement('table'); var tbBody = document.createElement('tbody'); var tableRow0 = document.createElement('tr'); var tableRow1 = document.createElement('tr'); var tableRow2 = document.createElement('tr'); var previousImgColumn = document.createElement('td'); var nextImgColumn = document.createElement('td'); var imageColumn = document.createElement('td'); var emptyColumn1 = document.createElement('td'); var textColumn =document.createElement('td'); var closeImageColumn = document.createElement('td'); var emptyColumn2 = document.createElement('td'); var emptyColumn0 = document.createElement('td'); setDarkLayer(darkLayer,lightBoxColor,tbElement); emptyColumn0.colSpan = 2; textColumn.style.textAlign = "left"; closeImageColumn.style.textAlign = "right"; bodyElement[0].appendChild(darkLayer); bodyElement[0].appendChild(bigDiv); bigDiv.appendChild(tbElement); tbElement.appendChild(tbBody); tbBody.appendChild(tableRow0); tableRow0.appendChild(emptyColumn0); tableRow0.appendChild(closeImageColumn); emptyColumn0.appendChild(emptyTxtElement); closeImageColumn.appendChild(closeImgElement); tbBody.appendChild(tableRow1); tableRow1.appendChild(previousImgColumn); tableRow1.appendChild(imageColumn); tableRow1.appendChild(nextImgColumn); previousImgColumn.appendChild(previousButtonImgElement); imageColumn.appendChild(imgElement); nextImgColumn.appendChild(nextButtonImgElement); tbBody.appendChild(tableRow2); tableRow2.appendChild(emptyColumn1); tableRow2.appendChild(textColumn); //tableRow2.appendChild(closeImageColumn); tableRow2.appendChild(emptyColumn2); emptyColumn1.appendChild(emptyTxtElement); textColumn.appendChild(txtElement); //closeImageColumn.appendChild(closeImgElement); emptyColumn2.appendChild(emptyTxtElement); setTimeout(function(){setBigDivPosition(bigDiv,tbElement);},1000); setTimeout(function(){setDarkLayer(darkLayer,lightBoxColor,tbElement);},1000); /*previousButtonImgElement.onload = function () { alert("1"); previousImgColumn.appendChild(previousButtonImgElement); };*/ /*nextButtonImgElement.onload = function () {alert("2"); nextImgColumn.appendChild(nextButtonImgElement); };*/ //alert(navigator.appName); previousButtonImgElement.onload = function (){appendLoadedImg(previousImgColumn,previousButtonImgElement);}; nextButtonImgElement.onload = function (){appendLoadedImg(nextImgColumn,nextButtonImgElement);}; if (navigator.appName == "Opera" || navigator.appName == "Netscape") { previousButtonImgElement.onload = appendLoadedImg(previousImgColumn,previousButtonImgElement); nextButtonImgElement.onload = appendLoadedImg(nextImgColumn,nextButtonImgElement); } imgElement.onload = function() { setBigDivPosition(bigDiv,tbElement); setDarkLayer(darkLayer,lightBoxColor,tbElement); }; closeImgElement.onclick = function() { bodyElement[0].removeChild(darkLayer); bodyElement[0].removeChild(bigDiv); }; darkLayer.onclick = function() { bodyElement[0].removeChild(darkLayer); bodyElement[0].removeChild(bigDiv); }; document.onkeydown = function(event) { if (event.keyCode == 27) { bodyElement[0].removeChild(darkLayer); bodyElement[0].removeChild(bigDiv); } else if (event.keyCode == 39) { var nextId = getNext(imgElement,imageArray); imgElement.src = imageArray[nextId].src; txtElement.innerHTML = lightBoxDataElement.arrayBildText[nextId]; } else if (event.keyCode == 37) { var previousId = getPrevious(imgElement,imageArray); imgElement.src = imageArray[previousId].src; txtElement.innerHTML = lightBoxDataElement.arrayBildText[previousId]; } return event.returnValue; }; nextButtonImgElement.onclick = function() { var nextId = getNext(imgElement,imageArray); imgElement.src = imageArray[nextId].src; txtElement.innerHTML = lightBoxDataElement.arrayBildText[nextId]; }; previousButtonImgElement.onclick = function() { var previousId = getPrevious(imgElement,imageArray); imgElement.src = imageArray[previousId].src; txtElement.innerHTML = lightBoxDataElement.arrayBildText[previousId]; }; } // // // // function appendLoadedImg(imgColumn,buttonImgElement) { imgColumn.appendChild(buttonImgElement); return; } // // // // function getNext(imgElement,imageArray) { var index = imgElement.src.lastIndexOf("/"); var tempStr = imgElement.src.substring(index+1,imgElement.src.length); var numericId = tempStr.replace(/[^0-9]/g,''); //var numericId = imgElement.src.replace(/[^0-9]/g,''); if(imageArray[numericId]) { return numericId; } else { return 0; } } // // // // function getPrevious(imgElement,imageArray) { var index = imgElement.src.lastIndexOf("/"); var tempStr = imgElement.src.substring(index+1,imgElement.src.length); var numericId = tempStr.replace(/[^0-9]/g,''); //var numericId = imgElement.src.replace(/[^0-9]/g,''); if(imageArray[numericId-2]) { return numericId-2; } else { return imageArray.length-1; } } // // // // function getLightBoxImages(imgSrc,lightBoxDataElement) { var imageArray = new Array(); var index = imgSrc.lastIndexOf("/") var tempStr = imgSrc.substring(index+1,imgSrc.length); var numericId = tempStr.replace(/[^0-9]/g,''); //Get path substrings var srcStringTeil1 = imgSrc.substring(0,(imgSrc.length)-(4+numericId.length)); var srcStringTeil2 = imgSrc.substring((imgSrc.length)-4,(imgSrc.length)); var newScr; for(i=1;i<=lightBoxDataElement.arrayBildText.length;i++) { newScr = srcStringTeil1 + i + srcStringTeil2; imageArray[i-1] = new Image(); imageArray[i-1].src = newScr; } return imageArray; } // // // function getLightBoxGalleryData(lightBoxGalleryData) { var elementArray = lightBoxGalleryData.split("|"); this.arrayBildText = new Array(); this.arrayBildId = new Array(); var subElementArray = new Array(); for (i=0;i tbElement.scrollHeight) { //var newTop = document.body.scrollTop + (viewportElement.viewportHeight - tbElement.scrollHeight)/2; var scrollTopPosition = 0; if(document.body.scrollTop > 0) { scrollTopPosition = document.body.scrollTop; } else if (document.getElementsByTagName('body')[0].scrollTop > 0) { scrollTopPosition = document.getElementsByTagName('body')[0].scrollTop; } else if(document.documentElement.scrollTop > 0 ) { scrollTopPosition = document.documentElement.scrollTop; } var newTop = scrollTopPosition + (viewportElement.viewportHeight - tbElement.scrollHeight)/2; } else { //var newTop = document.body.scrollTop; var newTop = 0; if(document.body.scrollTop > 0) { newTop = document.body.scrollTop; } else if (document.getElementsByTagName('body')[0].scrollTop > 0) { newTop = document.getElementsByTagName('body')[0].scrollTop; } else if(document.documentElement.scrollTop > 0 ) { newTop = document.documentElement.scrollTop; } } if(viewportElement.viewportWidth > tbElement.scrollWidth) { //var newLeft = document.body.scrollLeft + (viewportElement.viewportWidth - tbElement.scrollWidth)/2; var scrollLeftPosition = 0; if(document.body.scrollLeft > 0) { scrollLeftPosition = document.body.scrollLeft; } else if (document.getElementsByTagName('body')[0].scrollLeft > 0) { scrollLeftPosition = document.getElementsByTagName('body')[0].scrollLeft; } else if(document.documentElement.scrollLeft > 0 ) { scrollLeftPosition = document.documentElement.scrollLeft; } var newLeft = scrollLeftPosition + (viewportElement.viewportWidth - tbElement.scrollWidth)/2; } else { //var newLeft = document.body.scrollLeft; var newLeft = 0; if(document.body.scrollLeft > 0) { newLeft = document.body.scrollLeft; } else if (document.getElementsByTagName('body')[0].scrollLeft > 0) { newLeft = document.getElementsByTagName('body')[0].scrollLeft; } else if(document.documentElement.scrollLeft > 0 ) { newLeft = document.documentElement.scrollLeft; } } bigDiv.style.top = newTop + "px"; bigDiv.style.left = newLeft + "px"; //alert(document.getElementsByTagName('body')[0].scrollTop + " - " + document.documentElement.scrollTop + " - " + document.body.scrollTop); var bodyElement = document.getElementsByTagName("body"); bodyElement[0].style.cursor = "default"; } // // // function getViewportSize() { this.viewportHeight = 0; this.viewportWidth = 0; if (typeof window.innerWidth != 'undefined') { this.viewportWidth = window.innerWidth; this.viewportHeight = window.innerHeight; } else if (typeof document.documentElement != 'undefined' && typeof document.documentElement.clientWidth != 'undefined' && document.documentElement.clientWidth != 0) { this.viewportWidth = document.documentElement.clientWidth; this.viewportHeight = document.documentElement.clientHeight; } else { this.viewportWidth = document.getElementsByTagName('body')[0].clientWidth; this.viewportHeight = document.getElementsByTagName('body')[0].clientHeight; } return this; } // // // function setDarkLayer(darkLayer,lightBoxColor,tbElement) { darkLayer.style.zIndex = 302; darkLayer.style.position = 'absolute'; darkLayer.style.top = '0px'; darkLayer.style.left = '0px'; var mainWrapper = document.getElementById("main-wrapper"); darkLayer.style.height = (Math.max(document.documentElement.scrollHeight, document.documentElement.offsetHeight, document.documentElement.clientHeight, mainWrapper.scrollHeight, document.body.scrollHeight)) + 'px'; darkLayer.style.width = (Math.max(document.documentElement.scrollWidth, document.documentElement.offsetWidth, document.documentElement.clientWidth, mainWrapper.scrollWidth, document.body.scrollWidth)) + 'px'; darkLayer.style.backgroundColor = lightBoxColor; setOpacity(darkLayer,0.6); } // // // function setOpacity(object,opacityPct) { object.style.zoom = 1; object.style.filter = 'alpha(Opacity=' + opacityPct*100 + ')'; //IE. object.style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity=" + opacityPct*100 + ")"; object.style.MozOpacity = opacityPct; object.style.opacity = opacityPct; }