Einzelnen Beitrag anzeigen
  #12 (permalink)  
Alt 07.05.2008, 12:05
cgdesign cgdesign ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 09.07.2004
Beiträge: 1.103
cgdesign befindet sich auf einem aufstrebenden Ast
Standard

Das ist genau das Problem, was all die AJAX-Boxen und Gallerien usw. haben, die mit einem Popup da immer aufgehen, egal welches Script das ist. Die haben das alle gleich gelöst: sie gaben dem layer einen feste Höhe und Breite durch Javascript mit, indem sie wohl die Bildschirmgröße und die Größe der Seite berechnet haben. Wie die das aber genau gemacht haben, weiß ich auch nicht, kann man aber sicherlich irgendwo nachschauen.

Habe mal nachgeschaut: Lightbox hat das so gemacht:
http://www.huddletogether.com/projec...js/lightbox.js

Code:
getPageSize: function() 
{
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = window.innerWidth + window.scrollMaxX;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	
	if (self.innerHeight) {	// all except Explorer
		if(document.documentElement.clientWidth){
			windowWidth = document.documentElement.clientWidth; 
		} else {
			windowWidth = self.innerWidth;
		}
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}

	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = xScroll;		
	} else {
		pageWidth = windowWidth;
	}

	return [pageWidth,pageHeight];
}
Und dann haben sie nur noch dem overlay die richtige Höhe und Breite mitgegeben:
var arrayPageSize = this.getPageSize();
... width: arrayPageSize[0] + 'px', height: arrayPageSize[1] + 'px'

Das ist aber mit Prototype gemacht, von daher kannst du es nicht 1 zu 1 übernehmen.

Firefox hat diesen Bug übrigens schon seit Jahren: https://bugzilla.mozilla.org/show_bug.cgi?id=167801
Man kann nur hoffen, dass sie diesen im FF3 beheben werden.

Ansonsten würde dein Beispiel mit position:fixed nicht ohne weiteres im IE funktionieren. Da müsste dann ein Cocktail aus bizarem CSS und Javascript her und ob das dann noch überall gleich aussieht, bezweifel ich jetzt schon, ohne es getestet zu haben. Da ist die Javascript-Lösung nun mal noch die Beste.

Geändert von cgdesign (07.05.2008 um 12:25 Uhr)
Mit Zitat antworten
Sponsored Links