mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 27.04.2024 00:52 Benutzername: Passwort: Auto-Login

Thema: Lytebox in übergroßen DIV zentrieren vom 26.05.2010


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Lytebox in übergroßen DIV zentrieren
Autor Nachricht
digitalshift
Threadersteller

Dabei seit: 26.05.2010
Ort: Dresden
Alter: -
Geschlecht: Männlich
Verfasst Mi 26.05.2010 17:19
Titel

Lytebox in übergroßen DIV zentrieren

Antworten mit Zitat Zum Seitenanfang

Hallo!

Ich möchte aus einem iFrame eine Lytebox-Galerie öffnen. Problem ist, dass der Parent aus mehreren horizontal angeordneten DIV's besteht. Insgesamt etwa 20.000 px Breite, da die Website horizontal scrollbar ist.

Ist das Parent so breit wie das Fenster funktioniert alles wunderbar. Ist es breiter verschiebt es sich.
Ich möchte nun die Lytebox-Galerie zentriert (horizontal und vertikal) anzeigen lassen.

Dazu habe ich in der CSS "position:fixed" eingefügt.
Danach ist es zwar immer zentriert, aber die Top-Position ist immer am Beginn der Website.

Damit entsteht ein neues Problem, sobald der iFrame vertikal scrollbar ist, wir die Galerie nicht mehr angezeigt, weil sie im nicht sichtbaren Bereich am Anfang der Seite liegt.

Hier noch der CSS-Code, aber ich vermute es liegt am JS:
Code:
#lbOverlay { position: fixed; top: 0; left: 0; z-index: 199999; width: 100%; height:  100%; }
   #lbOverlay.grey { background-color: #000000; }
   #lbOverlay.red { background-color: #330000; }
   #lbOverlay.green { background-color: #003300; }
   #lbOverlay.blue { background-color: #011D50; }
   #lbOverlay.gold { background-color: #666600; }

#lbMain { position: absolute; top: 0; left: 20px; width: 100%; z-index: 300000; text-align: center; line-height: 0; }
#lbMain a img { border: none; }


Habt Ihr eine Lösung?
Eine knifflige Programmier-Frage – ich hoffe Ihr könnte helfen.

Danke!
Johannes


Zuletzt bearbeitet von digitalshift am Mi 26.05.2010 17:21, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
pixelpapst303

Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht: Männlich
Verfasst Do 27.05.2010 12:36
Titel

Re: Lytebox in übergroßen DIV zentrieren

Antworten mit Zitat Zum Seitenanfang

digitalshift hat geschrieben:
weil sie im nicht sichtbaren Bereich am Anfang der Seite liegt.

Hier noch der CSS-Code, aber ich vermute es liegt am JS:


ich vermute, da liegt dein problem... 100% im css bezieht sich auf die komplette seite (inkl. scrollbarer bereich außerhalb der sichtbarkeit)

ansatz wäre vielleicht das js umzuschreiben, dass sich die box nur auf den viewport bezieht....
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
digitalshift
Threadersteller

Dabei seit: 26.05.2010
Ort: Dresden
Alter: -
Geschlecht: Männlich
Verfasst Do 03.06.2010 12:28
Titel

Antworten mit Zitat Zum Seitenanfang

Wenn ich für den Hauptcontainer "position:fixed" setze und für den Galerie-Container "position: absolute" ist zumindest alles vertikal immer an gleicher Stelle ausgerichtet. Jetzt muss ich die Galerie nur noch horizontal ausrichten.

In der CSS kann ich für "left" einen beliebigen Wert z.B. "5000 px" setzen. Die Galerie wird dann im richtigen Container angezeigt. Nun musste ich nur noch für die anderen Container jeweil eine modifizierte CSS zuweisen. Das scheitert aber leider daran, dass wegen der iFrames, die CSS zentral in der "index.html" hinterlegt ist.

Wie könnte ich dieses Problem lösen?

pixelpapst303 ist sich sicher, dass es nur über das JS geht – nur da Blick ich gar nicht mehr durch. Nachfolgend der JS-Code:

[code:1:16265a1c73]Array.prototype.removeDuplicates = function () { for (var i = 1; i < this.length; i++){ if (this[i][0] == this[i-1][0]) { this.splice(i,1); } } };
Array.prototype.empty = function () { for (var i = 0; i <= this.length; i++) { this.shift(); } };
String.prototype.trim = function () { return this.replace(/^\s+|\s+$/g, ''); };

function LyteBox() {
/*** Start Global Configuration ***/
this.theme = 'grey'; // themes: grey (default), red, green, blue, gold
this.hideFlash = true; // controls whether or not Flash objects should be hidden
this.outerBorder = false; // controls whether to show the outer grey (or theme) border
this.resizeSpeed = 8; // controls the speed of the image resizing (1=slowest and 10=fastest)
this.maxOpacity = 80; // higher opacity = darker overlay, lower opacity = lighter overlay
this.navType = 1; // 1 = "Prev/Next" buttons on top left and left (default), 2 = "<< prev | next >>" links next to image number
this.autoResize = false; // controls whether or not images should be resized if larger than the browser window dimensions
this.doAnimations = true; // controls whether or not "animate" Lytebox, i.e. resize transition between images, fade in/out effects, etc.

this.borderSize = 12; // if you adjust the padding in the CSS, you will need to update this variable -- otherwise, leave this alone...
/*** End Global Configuration ***/

/*** Configure Slideshow Options ***/
this.slideInterval = 4000; // Change value (milliseconds) to increase/decrease the time between "slides" (10000 = 10 seconds)
this.showNavigation = true; // true to display Next/Prev buttons/text during slideshow, false to hide
this.showClose = false; // true to display the Close button, false to hide. Good to hide if Click to Close is enabled
this.showDetails = true; // true to display image details (caption, count), false to hide
this.showPlayPause = true; // true to display pause/play buttons next to close button, false to hide
this.autoEnd = true; // true to automatically close Lytebox after the last image is reached, false to keep open
this.pauseOnNextClick = false; // true to pause the slideshow when the "Next" button is clicked
this.pauseOnPrevClick = true; // true to pause the slideshow when the "Prev" button is clicked
/*** End Slideshow Configuration ***/

/*** Start Addon Configuration ***/
this.easySave = true; // true to enable Easy Save (To save image - right click and select Save Target As/Save Link As)
this.clickToClose = true; // true to exit Lytebox when clicking on image (if Navigation buttons are not overlapping). navType=1 only.
this.C2CrightSided = true; // true to use right side style close area on groups with single image
this.showCloseInFrame = true; // true to display the Close button in frame mode despite it is swinched off globaly, false to hide.
this.showHints = true; // true to display Hint messages over the buttons. Good to inform user about shortcuts
this.showSave = false; // true to display Save button next to close button, false to hide
this.showResize = true; // true to display Resize button next to close button, false to hide
this.showInfo = true; // true to display info button next to close button, false to hide. Searches Special Parameter for [info]Additional text[/info]
this.showExif = true; // true to display exif button next to close button, false to hide. Searches Special Parameter for [exif=true]
this.showBack = true; // true to display back button next to close button, false to hide
/*** End Addon Configuration ***/

/*** Start Teg Configuration ***/
this.tagBox = 'lytebox'; // Catch the following name in Anchor REV parameter for LyteBox
this.tagShow = 'lyteshow'; // Catch the following name in Anchor REV parameter for LyteShow
this.tagFrame = 'lyteframe'; // Catch the following name in Anchor REV parameter for LyteFrame
/*** Start Teg Configuration ***/

/*** Configure Info and Exif Configuration ***/
this.specialParam = 'rev'; // says to Lytebox, which parameter use to get Info and Exif data
this.linkInfo = 'info.php?info='; // This link will be openned in Lyteframe, information string will be added at the end
this.linkExif = 'exif.php?image='; // This link will be openned in Lyteframe, filename will be added at the end
this.LyteframeStyle = 'width: 400px; height: 400px; scrolling: auto'; // Default style of Lyteframe (Not really style, but form for sure)
this.TempFrameStyle = 'width: 572px; height: 424px; scrolling: auto'; // Default style of Temp Frame to show Info and Exif (Same here)
/*** End Info and Exif Configuration ***/

/*** Start String Configuration ***/
this.hintClose = "Close"; // Shortcut: 'Escape' or 'X' or 'C'
this.hintPlay = "Continue SlideShow";
this.hintPause = "Pause SlideShow";
this.hintNext = "Next Image. \n"; // Shortcut: 'Right Arrow' or 'N'
this.hintPrev = "Previous Image. \n"; // Shortcut: 'Left Arrow' or 'P'
this.hintSave = "Use this button to get link to current image";
this.hintResize = "Resize this image to fit your screen size OR back to original size. Shortcut: press 'R' or 'S'"; // Shortcut: 'R' or 'S'
this.hintInfo = "Show additional information about this image. Shortcut: press 'I'"; // Shortcut: 'I'
this.hintExif = "Show EXIF information about this image. Shortcut: press 'E'"; // Shortcut: 'E'
this.hintBack = "Return back to image. Shortcut: press Left Arrow or 'P'"; // Shortcut: 'Left Arrow' or 'P'
this.hintEasySave = "To save Current image - right click and select Save Target As/Save Link As";
this.hintClickToClose = "Click to Close. \n";
this.textImageNum = "Image %1 of %2"; // %1 - current, %2 - total
this.textPageNum = "Page %1 of %2"; // %1 - current, %2 - total
this.textNavPrev = "&laquo; PREV"; // &laquo; prev
this.textNavNext = "NEXT &raquo;"; // next &raquo;
this.textNavDelim = "||"; // Separates Prev and Next
/*** End String Configuration ***/

if(this.resizeSpeed > 10) { this.resizeSpeed = 10; }
if(this.resizeSpeed < 1) { resizeSpeed = 1; }
this.resizeDuration = (11 - this.resizeSpeed) * 0.15;
this.resizeWTimerArray = new Array();
this.resizeWTimerCount = 0;
this.resizeHTimerArray = new Array();
this.resizeHTimerCount = 0;
this.showContentTimerArray = new Array();
this.showContentTimerCount = 0;
this.overlayTimerArray = new Array();
this.overlayTimerCount = 0;
this.imageTimerArray = new Array();
this.imageTimerCount = 0;
this.timerIDArray = new Array();
this.timerIDCount = 0;
this.slideshowIDArray = new Array();
this.slideshowIDCount = 0;
this.imageArray = new Array();
this.activeImage = null;
this.slideArray = new Array();
this.activeSlide = null;
this.frameArray = new Array();
this.activeFrame = null;
this.checkFrame();
this.isSlideshow = false;
this.isLyteframe = false;
this.isShowTempFrame = false;
this.TempFrame = new Array();
this.HasInfo = false;
this.HasExif = false;
/*@cc_on
/*@if (@_jscript)
this.ie = (document.all && !window.opera) ? true : false;
/*@else @*/
this.ie = false;
/*@end
@*/
this.ie7 = (this.ie && window.XMLHttpRequest);
this.initialize();
}

LyteBox.prototype.getInfoString = function(string){
if (string == null || string == '')
return '';

var string = string.replace(/\r\n/g,"<br/>");
var string = string.replace(/\n/g,"<br/>");
var string = string.replace(/\r/g,"<br/>");
var info = /\[info\](.*?)\[\/info\]/i.exec(string);
if (info!=null)
return info[1];
else
return '';
};

LyteBox.prototype.getShowExif = function(string){
if (string == null || string == '')
return false;

var exif = /\[exif=true\]/i.exec(string);
if (exif!=null)
return true;
else
return false;
};

LyteBox.prototype.compileSpecialString = function() {
if (arguments.length==0){
return false;
} else if (arguments.length==1){
return arguments[0];
} else {
var items = arguments.length;
var str = arguments[0];
for (i = 1;i < items;i++){
str = str.replace('%' + i,arguments[i]);
}
return str;
}
};
LyteBox.prototype.initialize = function() {
this.updateLyteboxItems();
var objBody = this.doc.getElementsByTagName("body").item(0);
if (this.doc.getElementById('lbOverlay')) {
objBody.removeChild(this.doc.getElementById("lbOverlay"));
objBody.removeChild(this.doc.getElementById("lbMain"));
}
var objOverlay = this.doc.createElement("div");
objOverlay.setAttribute('id','lbOverlay');
objOverlay.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objOverlay.style.display = 'none';
objBody.appendChild(objOverlay);
var objLytebox = this.doc.createElement("div");
objLytebox.setAttribute('id','lbMain');
objLytebox.style.display = 'none';
objBody.appendChild(objLytebox);
var objOuterContainer = this.doc.createElement("div");
objOuterContainer.setAttribute('id','lbOuterContainer');
objOuterContainer.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objLytebox.appendChild(objOuterContainer);
var objIframeContainer = this.doc.createElement("div");
objIframeContainer.setAttribute('id','lbIframeContainer');
objIframeContainer.style.display = 'none';
objOuterContainer.appendChild(objIframeContainer);
var objIframe = this.doc.createElement("iframe");
objIframe.setAttribute('id','lbIframe');
objIframe.setAttribute('name','lbIframe');
objIframe.setAttribute('frameBorder','0'); // This is fixing issue with frame border in IE
objIframe.style.display = 'none';
objIframeContainer.appendChild(objIframe);
var objImageContainer = this.doc.createElement("div");
objImageContainer.setAttribute('id','lbImageContainer');
objOuterContainer.appendChild(objImageContainer);
var objLyteboxImage = this.doc.createElement("img");
objLyteboxImage.setAttribute('id','lbImage');
objImageContainer.appendChild(objLyteboxImage);
var objLoading = this.doc.createElement("div");
objLoading.setAttribute('id','lbLoading');
objOuterContainer.appendChild(objLoading);
var objDetailsContainer = this.doc.createElement("div");
objDetailsContainer.setAttribute('id','lbDetailsContainer');
objDetailsContainer.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objLytebox.appendChild(objDetailsContainer);
var objDetailsData =this.doc.createElement("div");
objDetailsData.setAttribute('id','lbDetailsData');
objDetailsData.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objDetailsContainer.appendChild(objDetailsData);
var objDetails = this.doc.createElement("div");
objDetails.setAttribute('id','lbDetails');
objDetailsData.appendChild(objDetails);
var objCaption = this.doc.createElement("span");
objCaption.setAttribute('id','lbCaption');
objDetails.appendChild(objCaption);
var objHoverNav = this.doc.createElement((this.easySave ? 'a' : 'div')); // Changed element type from DIV to A. Needed to make Quick Save and Click To Close features
objHoverNav.setAttribute('id','lbHoverNav');
objHoverNav.setAttribute('title',(this.showHints ? ((this.clickToClose ? this.hintClickToClose : '') + (this.easySave ? this.hintEasySave : '')) : ''));
objImageContainer.appendChild(objHoverNav);
var objBottomNav = this.doc.createElement("div");
objBottomNav.setAttribute('id','lbBottomNav');
objDetailsData.appendChild(objBottomNav);
var objPrev = this.doc.createElement("a");
objPrev.setAttribute('id','lbPrev');
objPrev.setAttribute('title',(this.showHints ? (this.hintPrev + (this.easySave ? this.hintEasySave : '')) : ''));
objPrev.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objPrev.setAttribute('href','#');
objHoverNav.appendChild(objPrev);
var objNext = this.doc.createElement("a");
objNext.setAttribute('id','lbNext');
objNext.setAttribute('title',(this.showHints ? (this.hintNext + (this.easySave ? this.hintEasySave : '')) : ''));
objNext.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objNext.setAttribute('href','#');
objHoverNav.appendChild(objNext);
var objC2Cleft = this.doc.createElement("a");
objC2Cleft.setAttribute('id','lbC2Cleft'); // We are creating special field used for Click to Close. Left part will appear on first image/slide in group instead of Prev navigation (navType=1)
objC2Cleft.setAttribute('title',(this.showHints ? ((this.clickToClose ? this.hintClickToClose : '') + (this.easySave ? this.hintEasySave : '')) : ''));
objC2Cleft.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objC2Cleft.setAttribute('href','#'); // In case of single image in image/slide group, either right or left part (depends on settings above) will be used to fill all the natigation area and hide other part.
objHoverNav.appendChild(objC2Cleft);
var objC2Cright = this.doc.createElement("a");
objC2Cright.setAttribute('id','lbC2Cright'); // Right part will appear on last image/slide in group instead of Next navigation (navType=1)
objC2Cright.setAttribute('title',(this.showHints ? ((this.clickToClose ? this.hintClickToClose : '') + (this.easySave ? this.hintEasySave : '')) : ''));
objC2Cright.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objC2Cright.setAttribute('href','#');
objHoverNav.appendChild(objC2Cright);
var objNumberDisplay = this.doc.createElement("span");
objNumberDisplay.setAttribute('id','lbNumberDisplay');
objDetails.appendChild(objNumberDisplay);
var objNavDisplay = this.doc.createElement("span");
objNavDisplay.setAttribute('id','lbNavDisplay');
objNavDisplay.style.display = 'none';
objDetails.appendChild(objNavDisplay);
var objClose = this.doc.createElement("a");
objClose.setAttribute('id','lbClose');
objClose.setAttribute('title',(this.showHints ? this.hintClose : '' ));
objClose.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objClose.setAttribute('href','#');
objBottomNav.appendChild(objClose);
var objPause = this.doc.createElement("a");
objPause.setAttribute('id','lbPause');
objPause.setAttribute('title',(this.showHints ? this.hintPause : ''));
objPause.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objPause.setAttribute('href','#');
objPause.style.display = 'none';
objBottomNav.appendChild(objPause);
var objPlay = this.doc.createElement("a");
objPlay.setAttribute('id','lbPlay');
objPlay.setAttribute('title',(this.showHints ? this.hintPlay : ''));
objPlay.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objPlay.setAttribute('href','#');
objPlay.style.display = 'none';
objBottomNav.appendChild(objPlay);
var objSave = this.doc.createElement("a");
objSave.setAttribute('id','lbSave');
objSave.setAttribute('title',(this.showHints ? this.hintSave : ''));
objSave.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objSave.setAttribute('href','#');
objSave.style.display = 'none';
objBottomNav.appendChild(objSave);
var objResize = this.doc.createElement("a");
objResize.setAttribute('id','lbResize');
objResize.setAttribute('title',(this.showHints ? this.hintResize : ''));
objResize.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objResize.setAttribute('href','#');
objResize.style.display = 'none';
objBottomNav.appendChild(objResize);
var objInfo = this.doc.createElement("a");
objInfo.setAttribute('id','lbInfo');
objInfo.setAttribute('title',(this.showHints ? this.hintInfo : ''));
objInfo.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objInfo.setAttribute('href','#');
objInfo.style.display = 'none';
objBottomNav.appendChild(objInfo);
var objExif = this.doc.createElement("a");
objExif.setAttribute('id','lbExif');
objExif.setAttribute('title',(this.showHints ? this.hintExif : ''));
objExif.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objExif.setAttribute('href','#');
objExif.style.display = 'none';
objBottomNav.appendChild(objExif);
var objBack = this.doc.createElement("a");
objBack.setAttribute('id','lbBack');
objBack.setAttribute('title',(this.showHints ? this.hintBack : ''));
objBack.setAttribute((this.ie ? 'className' : 'class'), this.theme);
objBack.setAttribute('href','#');
objBack.style.display = 'none';
objBottomNav.appendChild(objBack);
};
LyteBox.prototype.updateLyteboxItems = function() {
var anchors = (this.isFrame) ? window.parent.frames[window.name].document.getElementsByTagName('a') : document.getElementsByTagName('a');
for (var i = 0; i < anchors.length; i++) {
var anchor = anchors[i];
var relAttribute = String(anchor.getAttribute('rel'));
if (anchor.getAttribute('href')) {
if (relAttribute.toLowerCase().match(this.tagBox)) {
anchor.onclick = function () { myLytebox.start(this, false, false); return false; }
} else if (relAttribute.toLowerCase().match(this.tagShow)) {
anchor.onclick = function () { myLytebox.start(this, true, false); return false; }
} else if (relAttribute.toLowerCase().match(this.tagFrame)) {
anchor.onclick = function () { myLytebox.start(this, false, true); return false; }
}
}
}
};
LyteBox.prototype.start = function(imageLink, doSlide, doFrame) {
if (this.ie && !this.ie7) { this.toggleSelects('hide'); }
if (this.hideFlash) { this.toggleFlash('hide'); }
this.isLyteframe = (doFrame ? true : false);
this.isShowTempFrame = false;
var pageSize = this.getPageSize();
var objOverlay = this.doc.getElementById('lbOverlay');
var objBody = this.doc.getElementsByTagName("body").item(0);
objOverlay.style.height = pageSize[1] + "px";
objOverlay.style.display = '';
this.appear('lbOverlay', (this.doAnimations ? 0 : this.maxOpacity));
var anchors = (this.isFrame) ? window.parent.frames[window.name].document.getElementsByTagName('a') : document.getElementsByTagName('a');
if (this.isLyteframe) {
this.frameArray = [];
this.frameNum = 0;
if ((imageLink.getAttribute('rel') == this.tagFrame)) {
var rev = imageLink.getAttribute('rev');
this.frameArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title'), (rev == null || rev == '' ? this.LyteframeStyle : rev)));
} else {
if (imageLink.getAttribute('rel').indexOf(this.tagFrame) != -1) {
for (var i = 0; i < anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))) {
var rev = anchor.getAttribute('rev');
this.frameArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title'), (rev == null || rev == '' ? this.LyteframeStyle : rev)));
}
}
this.frameArray.removeDuplicates();
while(this.frameArray[this.frameNum][0] != imageLink.getAttribute('href')) { this.frameNum++; }
}
}
} else {
this.imageArray = [];
this.imageNum = 0;
this.slideArray = [];
this.slideNum = 0;
if ((imageLink.getAttribute('rel') == this.tagBox)) {
this.imageArray.push(new Array(imageLink.getAttribute('href'), imageLink.getAttribute('title'), this.getInfoString(imageLink.getAttribute(this.specialParam)), this.getShowExif(imageLink.getAttribute(this.specialParam))));
} else {
if (imageLink.getAttribute('rel').indexOf(this.tagBox) != -1) {
for (var i = 0; i < anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))) {
this.imageArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title'), this.getInfoString(anchor.getAttribute(this.specialParam)), this.getShowExif(anchor.getAttribute(this.specialParam))));
}
}
this.imageArray.removeDuplicates();
while(this.imageArray[this.imageNum][0] != imageLink.getAttribute('href')) { this.imageNum++; }
}
if (imageLink.getAttribute('rel').indexOf(this.tagShow) != -1) {
for (var i = 0; i < anchors.length; i++) {
var anchor = anchors[i];
if (anchor.getAttribute('href') && (anchor.getAttribute('rel') == imageLink.getAttribute('rel'))) {
this.slideArray.push(new Array(anchor.getAttribute('href'), anchor.getAttribute('title'), this.getInfoString(anchor.getAttribute(this.specialParam)), this.getShowExif(anchor.getAttribute(this.specialParam))));
}
}
this.slideArray.removeDuplicates();
while(this.slideArray[this.slideNum][0] != imageLink.getAttribute('href')) { this.slideNum++; }
}
}
}
var object = this.doc.getElementById('lbMain');
object.style.top = (this.getPageScroll() + (pageSize[3] / 15)) + "px";
object.style.display = '';
if (!this.outerBorder) {
this.doc.getElementById('lbOuterContainer').style.border = 'none';
this.doc.getElementById('lbDetailsContainer').style.border = 'none';
} else {
this.doc.getElementById('lbOuterContainer').style.borderBottom = '';
this.doc.getElementById('lbOuterContainer').setAttribute((this.ie ? 'className' : 'class'), this.theme);
}
this.doc.getElementById('lbOverlay').onclick = function() { myLytebox.end(); return false; };
this.doc.getElementById('lbMain').onclick = function(e) {
var e = e;
if (!e) {
if (window.parent.frames[window.name] && (parent.document.getElementsByTagName('frameset').length <= 0)) {
e = window.parent.window.event;
} else {
e = window.event;
}
}
var id = (e.target ? e.target.id : e.srcElement.id);
if (id == 'lbMain') { myLytebox.end(); return false; }
};
this.doc.getElementById('lbHoverNav').onclick = function() { return false; };
this.doc.getElementById('lbC2Cleft').onclick = function() { myLytebox.end(); return false; };
this.doc.getElementById('lbC2Cright').onclick = function() { myLytebox.end(); return false; };
this.doc.getElementById('lbClose').onclick = function() { myLytebox.end(); return false; };
this.doc.getElementById('lbPause').onclick = function() { myLytebox.togglePlayPause("lbPause", "lbPlay"); return false; };
this.doc.getElementById('lbPlay').onclick = function() { myLytebox.togglePlayPause("lbPlay", "lbPause"); return false; };
this.doc.getElementById('lbSave').onclick = function() { return false; };
this.doc.getElementById('lbResize').onclick = function() { myLytebox.resize(); return false; };
this.doc.getElementById('lbInfo').onclick = function() { myLytebox.info(); return false; };
this.doc.getElementById('lbExif').onclick = function() { myLytebox.exif(); return false; };
this.doc.getElementById('lbBack').onclick = function() { myLytebox.back(); return false; };
// Below code is removing selection border when clicking on buttons. EXPERIMENTAL. Can't use just blur() because of issue with shortcuts being inactive then.
this.doc.getElementById('lbHoverNav').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbC2Cleft').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbC2Cright').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbNext').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbPrev').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbClose').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbPause').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbPlay').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbSave').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbResize').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbInfo').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbExif').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };
this.doc.getElementById('lbBack').onfocus = function() { (!this.ie ? objBody.focus() : blur()); };

this.isSlideshow = doSlide;
this.isPaused = (this.slideNum != 0 ? true : false);
if (this.isSlideshow && this.showPlayPause && this.isPaused) {
this.doc.getElementById('lbPlay').style.display = '';
this.doc.getElementById('lbPause').style.display = 'none';
}
if (this.isLyteframe) {
this.changeContent(this.frameNum);
} else {
if (this.isSlideshow) {
this.changeContent(this.slideNum);
} else {
this.changeContent(this.imageNum);
}
}
};
LyteBox.prototype.changeContent = function(imageNum) {
this.clearFrame();


if (this.isSlideshow) {
for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); }
}
this.activeImage = this.activeSlide = this.activeFrame = imageNum;
if (!this.outerBorder) {
this.doc.getElementById('lbOuterContainer').style.border = 'none';
this.doc.getElementById('lbDetailsContainer').style.border = 'none';
} else {
this.doc.getElementById('lbOuterContainer').style.borderBottom = '';
this.doc.getElementById('lbOuterContainer').setAttribute((this.ie ? 'className' : 'class'), this.theme);
}
this.doc.getElementById('lbLoading').style.display = '';
this.doc.getElementById('lbImage').style.display = 'none';
this.doc.getElementById('lbIframe').style.display = 'none';
this.doc.getElementById('lbPrev').style.display = 'none';
this.doc.getElementById('lbNext').style.display = 'none';
this.doc.getElementById('lbC2Cleft').style.display = 'none';
this.doc.getElementById('lbC2Cright').style.display = 'none';
this.doc.getElementById('lbC2Cleft').style.width = '49.9%';
this.doc.getElementById('lbC2Cright').style.width = '49.9%';
this.doc.getElementById('lbIframeContainer').style.display = 'none';
this.doc.getElementById('lbDetailsContainer').style.display = 'none';
this.doc.getElementById('lbNumberDisplay').style.display = 'none';
if (this.navType == 2 || this.isLyteframe) {
object = this.doc.getElementById('lbNavDisplay');
object.innerHTML = '&nbsp;&nbsp;&nbsp;<span id="lbPrev2_Off" style="display: none;" class="' + this.theme + '">' + this.textNavPrev + '</span><a href="#" id="lbPrev2" class="' + this.theme + '" style="display: none;">' + this.textNavPrev + '</a> <b id="lbSpacer" class="' + this.theme + '">' + this.textNavDelim + '</b> <span id="lbNext2_Off" style="display: none;" class="' + this.theme + '">' + this.textNavNext + '</span><a href="#" id="lbNext2" class="' + this.theme + '" style="display: none;">' + this.textNavNext + '</a>';
object.style.display = 'none';
}
if (this.isLyteframe || this.isShowTempFrame) {
var iframe = myLytebox.doc.getElementById('lbIframe');
var styles = (this.isShowTempFrame ? this.TempFrameStyle : this.frameArray[this.activeFrame][2]);
var aStyles = styles.split(';');
for (var i = 0; i < aStyles.length; i++) {
if (aStyles[i].indexOf('width:') >= 0) {
var w = aStyles[i].replace('width:', '');
iframe.width = w.trim();
} else if (aStyles[i].indexOf('height:') >= 0) {
var h = aStyles[i].replace('height:', '');
iframe.height = h.trim();
} else if (aStyles[i].indexOf('scrolling:') >= 0) {
var s = aStyles[i].replace('scrolling:', '');
iframe.scrolling = s.trim();
} else if (aStyles[i].indexOf('border:') >= 0) {
// Not implemented yet, as there are cross-platform issues with setting the border (from a GUI standpoint)
// var b = aStyles[i].replace('border:', '');
// iframe.style.border = b.trim();
}
}
iframe.src = (this.isShowTempFrame ? this.TempFrame[0] : this.frameArray[this.activeFrame][0]);
this.resizeContainer(parseInt(iframe.width), parseInt(iframe.height));
} else {
imgPreloader = new Image();
imgPreloader.onload = function() {
var imageWidth = imgPreloader.width;
var imageHeight = imgPreloader.height;
var pagesize = myLytebox.getPageSize();
var x = pagesize[2] - 150;
var y = pagesize[3] - 150;
if (imageWidth > x) {
myLytebox.canResize = true;
} else if (imageHeight > y) {
myLytebox.canResize = true;
} else {
myLytebox.canResize = false;
}
if (myLytebox.autoResize && myLytebox.canResize) {
if (imageWidth > x) {
imageHeight = Math.round(imageHeight * (x / imageWidth));
imageWidth = x;
if (imageHeight > y) {
imageWidth = Math.round(imageWidth * (y / imageHeight));
imageHeight = y;
}
} else if (imageHeight > y) {
imageWidth = Math.round(imageWidth * (y / imageHeight));
imageHeight = y;
if (imageWidth > x) {
imageHeight = Math.round(imageHeight * (x / imageWidth));
imageWidth = x;
}
}
}
var lbImage = myLytebox.doc.getElementById('lbImage');
lbImage.src = (myLytebox.isSlideshow ? myLytebox.slideArray[myLytebox.activeSlide][0] : myLytebox.imageArray[myLytebox.activeImage][0]);
lbImage.width = imageWidth;
lbImage.height = imageHeight;
myLytebox.resizeContainer(imageWidth, imageHeight);
imgPreloader.onload = function() {};
};
imgPreloader.src = (this.isSlideshow ? this.slideArray[this.activeSlide][0] : this.imageArray[this.activeImage][0]);
}
};
LyteBox.prototype.resizeContainer = function(imgWidth, imgHeight) {
this.wCur = this.doc.getElementById('lbOuterContainer').offsetWidth;
this.hCur = this.doc.getElementById('lbOuterContainer').offsetHeight;
this.xScale = ((imgWidth + (this.borderSize * 2)) / this.wCur) * 100;
this.yScale = ((imgHeight + (this.borderSize * 2)) / this.hCur) * 100;
var wDiff = (this.wCur - this.borderSize * 2) - imgWidth;
var hDiff = (this.hCur - this.borderSize * 2) - imgHeight;
if (!(hDiff == 0)) {
this.hDone = false;
this.resizeH('lbOuterContainer', this.hCur, imgHeight + this.borderSize*2, this.getPixelRate(this.hCur, imgHeight));
} else {
this.hDone = true;
}
if (!(wDiff == 0)) {
this.wDone = false;
this.resizeW('lbOuterContainer', this.wCur, imgWidth + this.borderSize*2, this.getPixelRate(this.wCur, imgWidth));
} else {
this.wDone = true;
}
if ((hDiff == 0) && (wDiff == 0)) {
if (this.ie){ this.pause(250); } else { this.pause(100); }
}
//this.doc.getElementById('lbPrev').style.height = imgHeight + "px"; // I don't know why this was here. It only makes object shorter than it should really be
//this.doc.getElementById('lbNext').style.height = imgHeight + "px"; // Using CSS we are making height 100%
this.doc.getElementById('lbDetailsContainer').style.width = (imgWidth + (this.borderSize * 2) + (this.ie && this.doc.compatMode == "BackCompat" && this.outerBorder ? 2 : 0)) + "px";
this.showContent();
};
LyteBox.prototype.showContent = function() {
if (this.wDone && this.hDone) {
for (var i = 0; i < this.showContentTimerCount; i++) { window.clearTimeout(this.showContentTimerArray[i]); }
if (this.outerBorder) {
this.doc.getElementById('lbOuterContainer').style.borderBottom = 'none';
}
this.doc.getElementById('lbLoading').style.display = 'none';
if (this.isShowTempFrame) {
this.doc.getElementById('lbIframe').style.display = '';
this.appear('lbIframe', (this.doAnimations ? 0 : 100));
} else if (this.isLyteframe) {
this.doc.getElementById('lbIframe').style.display = '';
this.appear('lbIframe', (this.doAnimations ? 0 : 100));
} else {
this.doc.getElementById('lbImage').style.display = '';
this.appear('lbImage', (this.doAnimations ? 0 : 100));
this.preloadNeighborImages();
}
if (this.isShowTempFrame){
this.doc.getElementById('lbHoverNav').style.display = 'none';
this.doc.getElementById('lbClose').style.display = (this.showCloseInFrame ? '' : 'none');
this.doc.getElementById('lbDetails').style.display = (this.showDetails ? '' : 'none');
this.doc.getElementById('lbPause').style.display = 'none';
this.doc.getElementById('lbPlay').style.display = 'none';
this.doc.getElementById('lbSave').style.display = 'none';
this.doc.getElementById('lbResize').style.display = 'none';
this.doc.getElementById('lbNavDisplay').style.display = 'none';
this.doc.getElementById('lbInfo').style.display = 'none';
this.doc.getElementById('lbExif').style.display = 'none';
this.doc.getElementById('lbBack').style.display = (this.showBack ? '' : 'none');

} else if (this.isSlideshow) {
if(this.activeSlide == (this.slideArray.length - 1)) {
if (this.autoEnd) {
this.slideshowIDArray[this.slideshowIDCount++] = setTimeout("myLytebox.end('slideshow')", this.slideInterval);
}
} else {
if (!this.isPaused) {
this.slideshowIDArray[this.slideshowIDCount++] = setTimeout("myLytebox.changeContent("+(this.activeSlide+1)+")", this.slideInterval);
}
}
this.HasInfo = (this.slideArray[this.activeSlide][2]!='' ? true : false);
this.HasExif = (this.slideArray[this.activeSlide][3] ? true : false);

this.doc.getElementById('lbHoverNav').style.display = (this.showNavigation && this.navType == 1 ? '' : 'none');
this.doc.getElementById('lbClose').style.display = (this.showClose ? '' : 'none');
this.doc.getElementById('lbDetails').style.display = (this.showDetails ? '' : 'none');
this.doc.getElementById('lbPause').style.display = (this.showPlayPause && !this.isPaused ? '' : 'none');
this.doc.getElementById('lbPlay').style.display = (this.showPlayPause && !this.isPaused ? 'none' : '');
this.doc.getElementById('lbSave').style.display = (this.showSave ? '' : 'none');
this.doc.getElementById('lbResize').style.display = (this.showResize && this.canResize ? '' : 'none');
this.doc.getElementById('lbNavDisplay').style.display = (this.showNavigation && this.navType == 2 ? '' : 'none');
this.doc.getElementById('lbInfo').style.display = (this.HasInfo && this.showInfo ? '' : 'none');
this.doc.getElementById('lbExif').style.display = (this.HasExif && this.showExif ? '' : 'none');
this.doc.getElementById('lbBack').style.display = 'none';

if (this.showSave) {
this.doc.getElementById('lbSave').href = this.slideArray[this.activeSlide][0];
}
if (this.easySave) {
this.doc.getElementById('lbHoverNav').href = this.slideArray[this.activeSlide][0];
this.doc.getElementById('lbPrev').href = this.slideArray[this.activeSlide][0];
this.doc.getElementById('lbNext').href = this.slideArray[this.activeSlide][0];
this.doc.getElementById('lbC2Cleft').href = this.slideArray[this.activeSlide][0];
this.doc.getElementById('lbC2Cright').href = this.slideArray[this.activeSlide][0];
}


} else {
this.doc.getElementById('lbHoverNav').style.display = (this.navType == 1 && !this.isLyteframe ? '' : 'none');
if ((this.navType == 2 && !this.isLyteframe && this.imageArray.length > 1) || (this.frameArray.length > 1 && this.isLyteframe)) {
this.doc.getElementById('lbNavDisplay').style.display = '';
} else {
this.doc.getElementById('lbNavDisplay').style.display = 'none';
}
this.HasInfo = (this.isLyteframe ? false : (this.imageArray[this.activeImage][2]!='' ? true : false));
this.HasExif = (this.isLyteframe ? false : (this.imageArray[this.activeImage][3] ? true : false));

this.doc.getElementById('lbClose').style.display = (!this.isLyteframe ? (this.showClose ? '' : 'none') : (this.showCloseInFrame ? '' : 'none'));
this.doc.getElementById('lbDetails').style.display = (this.showDetails ? '' : 'none');
this.doc.getElementById('lbPause').style.display = 'none';
this.doc.getElementById('lbPlay').style.display = 'none';
this.doc.getElementById('lbSave').style.display = (!this.isLyteframe && this.showSave ? '' : 'none');
this.doc.getElementById('lbResize').style.display = (!this.isLyteframe && this.showResize && this.canResize ? '' : 'none');
this.doc.getElementById('lbInfo').style.display = (this.HasInfo && this.showInfo ? '' : 'none');
this.doc.getElementById('lbExif').style.display = (this.HasExif && this.showExif ? '' : 'none');
this.doc.getElementById('lbBack').style.display = 'none';

if (!this.isLyteframe && this.showSave) {
this.doc.getElementById('lbSave').href = this.imageArray[this.activeImage][0];
}
if (!this.isLyteframe && this.easySave) {
this.doc.getElementById('lbHoverNav').href = this.imageArray[this.activeImage][0];
this.doc.getElementById('lbPrev').href = this.imageArray[this.activeImage][0];
this.doc.getElementById('lbNext').href = this.imageArray[this.activeImage][0];
this.doc.getElementById('lbC2Cleft').href = this.imageArray[this.activeImage][0];
this.doc.getElementById('lbC2Cright').href = this.imageArray[this.activeImage][0];
}
}
this.doc.getElementById('lbImageContainer').style.display = (this.isLyteframe || this.isShowTempFrame ? 'none' : '');
this.doc.getElementById('lbIframeContainer').style.display = (this.isLyteframe || this.isShowTempFrame ? '' : 'none');
} else {
this.showContentTimerArray[this.showContentTimerCount++] = setTimeout("myLytebox.showContent()", 200);
}
};
LyteBox.prototype.updateDetails = function() {
var object = this.doc.getElementById('lbCaption');
var sTitle = (this.isShowTempFrame ? this.TempFrame[1] : (this.isSlideshow ? this.slideArray[this.activeSlide][1] : (this.isLyteframe ? this.frameArray[this.activeFrame][1] : this.imageArray[this.activeImage][1])));
object.style.display = '';
object.innerHTML = (sTitle == null ? '' : sTitle);
this.updateNav();
this.doc.getElementById('lbDetailsContainer').style.display = '';
object = this.doc.getElementById('lbNumberDisplay');
if (this.isShowTempFrame){
this.doc.getElementById('lbNavDisplay').style.display = 'none';
} else if (this.isSlideshow && this.slideArray.length > 1) {
object.style.display = '';
object.innerHTML = this.compileSpecialString(this.textImageNum, eval(this.activeSlide + 1), this.slideArray.length);
this.doc.getElementById('lbNavDisplay').style.display = (this.navType == 2 && this.showNavigation ? '' : 'none');
} else if (this.imageArray.length > 1 && !this.isLyteframe) {
object.style.display = '';
object.innerHTML = this.compileSpecialString(this.textImageNum, eval(this.activeImage + 1), this.imageArray.length);
this.doc.getElementById('lbNavDisplay').style.display = (this.navType == 2 ? '' : 'none');
} else if (this.frameArray.length > 1 && this.isLyteframe) {
object.style.display = '';
object.innerHTML = this.compileSpecialString(this.textPageNum, eval(this.activeFrame + 1), this.frameArray.length);
this.doc.getElementById('lbNavDisplay').style.display = '';
} else {
this.doc.getElementById('lbNavDisplay').style.display = 'none';
}
this.appear('lbDetailsContainer', (this.doAnimations ? 0 : 100));
};
LyteBox.prototype.updateNav = function() {
if (this.isSlideshow) {
if (this.activeSlide != 0) { // Displays PREV if it is NOT a First slide
var object = (this.navType == 2 ? this.doc.getElementById('lbPrev2') : this.doc.getElementById('lbPrev'));
object.style.display = '';
object.onclick = function() {
if (myLytebox.pauseOnPrevClick) { myLytebox.togglePlayPause("lbPause", "lbPlay"); }
myLytebox.changeContent(myLytebox.activeSlide - 1); return false;
}
} else { // Don't show PREV in navType = 1 if it IS a First slide
if (this.clickToClose){
if (this.slideArray.length == 1){
this.doc.getElementById('lbC2Cleft').style.width = (this.C2CrightSided ? '' : '100%');
this.doc.getElementById('lbC2Cleft').style.display = (this.C2CrightSided ? 'none' : '');
} else {
this.doc.getElementById('lbC2Cleft').style.display = '';
}
}

if (this.navType == 2) { this.doc.getElementById('lbPrev2_Off').style.display = ''; }
}
if (this.activeSlide != (this.slideArray.length - 1)) { // Displays NEXT if it is NOT a Last slide
var object = (this.navType == 2 ? this.doc.getElementById('lbNext2') : this.doc.getElementById('lbNext'));
object.style.display = '';
object.onclick = function() {
if (myLytebox.pauseOnNextClick) { myLytebox.togglePlayPause("lbPause", "lbPlay"); }
myLytebox.changeContent(myLytebox.activeSlide + 1); return false;
}
} else { // Don't show NEXT in navType = 1 if it IS a Last slide
if (this.clickToClose){
if (this.slideArray.length == 1){
this.doc.getElementById('lbC2Cright').style.width = (this.C2CrightSided ? '100%' : '');
this.doc.getElementById('lbC2Cright').style.display = (this.C2CrightSided ? '' : 'none');
} else {
this.doc.getElementById('lbC2Cright').style.display = '';
}
}

if (this.navType == 2) { this.doc.getElementById('lbNext2_Off').style.display = ''; }
}
} else if (this.isLyteframe) {
if(this.activeFrame != 0) {
var object = this.doc.getElementById('lbPrev2');
object.style.display = '';
object.onclick = function() {
myLytebox.changeContent(myLytebox.activeFrame - 1); return false;
}
} else {
this.doc.getElementById('lbPrev2_Off').style.display = '';
}
if(this.activeFrame != (this.frameArray.length - 1)) {
var object = this.doc.getElementById('lbNext2');
object.style.display = '';
object.onclick = function() {
myLytebox.changeContent(myLytebox.activeFrame + 1); return false;
}
} else {
this.doc.getElementById('lbNext2_Off').style.display = '';
}
} else {
if(this.activeImage != 0) {
var object = (this.navType == 2 ? this.doc.getElementById('lbPrev2') : this.doc.getElementById('lbPrev'));
object.style.display = '';
object.onclick = function() {
myLytebox.changeContent(myLytebox.activeImage - 1); return false;
}
} else {
if (this.clickToClose){
if (this.imageArray.length == 1){
this.doc.getElementById('lbC2Cleft').style.width = (this.C2CrightSided ? '' : '100%');
this.doc.getElementById('lbC2Cleft').style.display = (this.C2CrightSided ? 'none' : '');
} else {
this.doc.getElementById('lbC2Cleft').style.display = '';
}
}

if (this.navType == 2) { this.doc.getElementById('lbPrev2_Off').style.display = ''; }
}
if(this.activeImage != (this.imageArray.length - 1)) {
var object = (this.navType == 2 ? this.doc.getElementById('lbNext2') : this.doc.getElementById('lbNext'));
object.style.display = '';
object.onclick = function() {
myLytebox.changeContent(myLytebox.activeImage + 1); return false;
}
} else {
if (this.clickToClose){
if (this.imageArray.length == 1){
this.doc.getElementById('lbC2Cright').style.width = (this.C2CrightSided ? '100%' : '');
this.doc.getElementById('lbC2Cright').style.display = (this.C2CrightSided ? '' : 'none');
} else {
this.doc.getElementById('lbC2Cright').style.display = '';
}
}

if (this.navType == 2) { this.doc.getElementById('lbNext2_Off').style.display = ''; }
}
}
this.enableKeyboardNav();
};
LyteBox.prototype.enableKeyboardNav = function() { document.onkeydown = this.keyboardAction; };
LyteBox.prototype.disableKeyboardNav = function() { document.onkeydown = ''; };
LyteBox.prototype.keyboardAction = function(e) {
var keycode = key = escape = null;
keycode = (e == null) ? event.keyCode : e.which;
key = String.fromCharCode(keycode).toLowerCase();
escape = (e == null) ? 27 : e.DOM_VK_ESCAPE;
if ((key == 'x') || (key == 'c') || (keycode == escape)) {
myLytebox.end();
} else if ((key == 'p') || (keycode == 37)) {
if (myLytebox.isShowTempFrame) {
myLytebox.back();
} else if (myLytebox.isSlideshow) {
if(myLytebox.activeSlide != 0) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeSlide - 1);
}
} else if (myLytebox.isLyteframe) {
if(myLytebox.activeFrame != 0) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeFrame - 1);
}
} else {
if(myLytebox.activeImage != 0) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeImage - 1);
}
}
} else if ((key == 'n') || (keycode == 39)) {
if (myLytebox.isShowTempFrame) {
// ignore
} else if (myLytebox.isSlideshow) {
if(myLytebox.activeSlide != (myLytebox.slideArray.length - 1)) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeSlide + 1);
}
} else if (myLytebox.isLyteframe) {
if(myLytebox.activeFrame != (myLytebox.frameArray.length - 1)) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeFrame + 1);
}
} else {
if(myLytebox.activeImage != (myLytebox.imageArray.length - 1)) {
myLytebox.disableKeyboardNav();
myLytebox.changeContent(myLytebox.activeImage + 1);
}
}
} else if ((key == 'r') || (key == 's')) {
if (!myLytebox.isShowTempFrame && !myLytebox.isLyteframe && myLytebox.canResize) {
myLytebox.disableKeyboardNav();
myLytebox.resize();
}
} else if (key == 'i') {
if (!myLytebox.isShowTempFrame && !myLytebox.isLyteframe && myLytebox.HasInfo) {
myLytebox.disableKeyboardNav();
myLytebox.info();
}
} else if (key == 'e') {
if (!myLytebox.isShowTempFrame && !myLytebox.isLyteframe && myLytebox.HasExif) {
myLytebox.disableKeyboardNav();
myLytebox.exif();
}
}
};
LyteBox.prototype.preloadNeighborImages = function() {
if (this.isSlideshow) {
if ((this.slideArray.length - 1) > this.activeSlide) {
preloadNextImage = new Image();
preloadNextImage.src = this.slideArray[this.activeSlide + 1][0];
}
if(this.activeSlide > 0) {
preloadPrevImage = new Image();
preloadPrevImage.src = this.slideArray[this.activeSlide - 1][0];
}
} else {
if ((this.imageArray.length - 1) > this.activeImage) {
preloadNextImage = new Image();
preloadNextImage.src = this.imageArray[this.activeImage + 1][0];
}
if(this.activeImage > 0) {
preloadPrevImage = new Image();
preloadPrevImage.src = this.imageArray[this.activeImage - 1][0];
}
}
};
LyteBox.prototype.togglePlayPause = function(hideID, showID) {
if (this.isSlideshow && hideID == "lbPause") {
for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); }
}
this.doc.getElementById(hideID).style.display = 'none';
this.doc.getElementById(showID).style.display = '';
if (hideID == "lbPlay") {
this.isPaused = false;
if (this.activeSlide == (this.slideArray.length - 1)) {
this.end();
} else {
this.changeContent(this.activeSlide + 1);
}
} else {
this.isPaused = true;
}
};
LyteBox.prototype.resize = function() {
if (this.canResize) {
if (this.autoResize) {
this.autoResize = false;
} else {
this.autoResize = true;
}
if (this.isSlideshow) {
this.changeContent(myLytebox.activeSlide);
} else {
this.changeContent(myLytebox.activeImage);
}
}
this.enableKeyboardNav();
};
LyteBox.prototype.info = function() {
if (this.isSlideshow) {
var back = this.activeSlide;
var title = this.slideArray[this.activeSlide][1];
var info = this.slideArray[this.activeSlide][2];
} else {
var back = this.activeImage;
var title = this.imageArray[this.activeImage][1];
var info = this.imageArray[this.activeImage][2];
}
this.isShowTempFrame = true;
this.TempFrame[0] = this.linkInfo + info;
this.TempFrame[1] = title;
this.TempFrame[2] = back;
this.changeContent();
};
LyteBox.prototype.exif = function() {
if (this.isSlideshow) {
var back = this.activeSlide;
var title = this.slideArray[this.activeSlide][1];
var file = this.slideArray[this.activeSlide][0];
} else {
var back = this.activeImage;
var title = this.imageArray[this.activeImage][1];
var file = this.imageArray[this.activeImage][0];
}
this.isShowTempFrame = true;
this.TempFrame[0] = this.linkExif + file;
this.TempFrame[1] = title;
this.TempFrame[2] = back;
this.changeContent();
};
LyteBox.prototype.back = function() {
this.isShowTempFrame = false;
this.changeContent(this.TempFrame[2]);
};
LyteBox.prototype.clearFrame = function() {
var iframe = myLytebox.doc.getElementById('lbIframe');
if (iframe.src != null && iframe.src != '' && iframe.src != 'about:blank')
{
iframe.src = 'about:blank';
}
};
LyteBox.prototype.end = function(caller) {
var closeClick = (caller == 'slideshow' ? false : true);
if (this.isSlideshow && this.isPaused && !closeClick) { return; }
this.disableKeyboardNav();
this.doc.getElementById('lbMain').style.display = 'none';
this.fade('lbOverlay', (this.doAnimations ? this.maxOpacity : 0));
this.toggleSelects('visible');
if (this.hideFlash) { this.toggleFlash('visible'); }
if (this.isSlideshow) {
for (var i = 0; i < this.slideshowIDCount; i++) { window.clearTimeout(this.slideshowIDArray[i]); }
}
this.clearFrame();
};
LyteBox.prototype.checkFrame = function() {
if (window.parent.frames[window.name] && (parent.document.getElementsByTagName('frameset').length <= 0)) {
this.isFrame = true;
this.lytebox = "window.parent." + window.name + ".myLytebox";
this.doc = parent.document;
} else {
this.isFrame = false;
this.lytebox = "myLytebox";
this.doc = document;
}
};
LyteBox.prototype.getPixelRate = function(cur, img) {
var diff = (img > cur) ? img - cur : cur - img;
if (diff >= 0 && diff <= 100) { return 10; }
if (diff > 100 && diff <= 200) { return 15; }
if (diff > 200 && diff <= 300) { return 20; }
if (diff > 300 && diff <= 400) { return 25; }
if (diff > 400 && diff <= 500) { return 30; }
if (diff > 500 && diff <= 600) { return 35; }
if (diff > 600 && diff <= 700) { return 40; }
if (diff > 700) { return 45; }
};
LyteBox.prototype.appear = function(id, opacity) {
var object = this.doc.getElementById(id).style;
object.opacity = (opacity / 100);
object.MozOpacity = (opacity / 100);
object.KhtmlOpacity = (opacity / 100);
object.filter = "alpha(opacity=" + (opacity + 10) + ")";
if (id == 'lbIframe') {
//object.display = 'none';
}
if (opacity == 100 && (id == 'lbImage' || id == 'lbIframe')) {
this.updateDetails();
} else if (opacity >= this.maxOpacity && id == 'lbOverlay') {
for (var i = 0; i < this.overlayTimerCount; i++) { window.clearTimeout(this.overlayTimerArray[i]); }
return;
} else if (opacity >= 100 && id == 'lbDetailsContainer') {
for (var i = 0; i < this.imageTimerCount; i++) { window.clearTimeout(this.imageTimerArray[i]); }
this.doc.getElementById('lbOverlay').[/cod


Zuletzt bearbeitet von digitalshift am Do 03.06.2010 12:33, insgesamt 3-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen Lytebox 5.5 Problem /
Lytebox: Bilder im IE verzerrt bzw. gestaucht!
Lytebox - wird mal angezeigt und mal nicht, warum?
Lytebox: Close-Button oben anzeigen lassen?
[SUCHE] Lytebox Mod: Extra Felder "kunde" und "job"
[CSS] Div zentrieren
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.