1
Hallo,
ich habe heute eine Art LightBox-Script mit jquery für Flash gemacht, welches prinzipiell so funktioniert, dass beim Aufruf an den Body folgende Elemente gebunden [$('body').append()] werden:
Mittels SWFObject wird dann in das div#flash der Flash-Movieclip geladen:
Das zugehörige CSS ist:
Fixes für IE 6+ (nebst nicht nennenswerter Scroll-Probleme, die über JS gefixt werden müssen):
Das funktioniert in allen Browsern (Opera, IE6, IE7, Safari) gut, nur Firefox hat Probleme. Manchmal spielt er das Flash ab, manchmal einfach nicht. Ein Rechtsklick auf die Flashbox hat dann einfach gar keine Wirkung (es wird nicht mal das Standard-Splashmenü gezeigt, auch nicht das des Flashplayers, gar keins) - die Box bleibt weiß und ohne Inhalt.
Jetzt hab ich mich Stunden geärgert, anstatt eines divs sogar ein iframe für die Flashbox probiert und das Flash in einer externen Datei geladen (selbes Resultat), bis ich ans CSS gegangen bin. Das Problem ist das position:fixed für div#overlay. Wenn ich das rausmache, funktionierts auch im Fx immer, nicht nur manchmal.
Ist zwar ein sehr spezielles Problem und tritt nur mit dieser relativ außergewöhnlichen Anwendung auf, aber wenn mal jemand vor demselben Problem steht... ich interpretiere das so, dass zwei überlappende Elemente mit position:fixed, wobei in einem ein Flash zur Laufzeit eingebunden wird, sich mit Fx nicht vertragen. Getestet mit Fx 2.0.0.12 / Windows XP.
ich habe heute eine Art LightBox-Script mit jquery für Flash gemacht, welches prinzipiell so funktioniert, dass beim Aufruf an den Body folgende Elemente gebunden [$('body').append()] werden:
<div id="overlay"></div><div id="flashbox"></div>
Mittels SWFObject wird dann in das div#flash der Flash-Movieclip geladen:
var swf = new SWFObject('meinflash.swf', 'flashmovie', '300', '200', '8')
swf.write('flashbox');
Das zugehörige CSS ist:
div#flashbox{ position: absolute; top: 50%; left: 50%; margin:-100px 0 0 -150px; z-index: 9999; border: 1px solid #ffffff; background: #fdfce9; text-align: left; }
div#flashbox[id]{ position: fixed; }
div#overlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 5000; background-color: #000000;/* -moz-opacity: 0.8; opacity: .80; filter: alpha(opacity=80); */}
div#overlay[id]{ position: fixed; }
Fixes für IE 6+ (nebst nicht nennenswerter Scroll-Probleme, die über JS gefixt werden müssen):
html, body {width:100%; height:100%; overflow:hidden; }
Das funktioniert in allen Browsern (Opera, IE6, IE7, Safari) gut, nur Firefox hat Probleme. Manchmal spielt er das Flash ab, manchmal einfach nicht. Ein Rechtsklick auf die Flashbox hat dann einfach gar keine Wirkung (es wird nicht mal das Standard-Splashmenü gezeigt, auch nicht das des Flashplayers, gar keins) - die Box bleibt weiß und ohne Inhalt.
Jetzt hab ich mich Stunden geärgert, anstatt eines divs sogar ein iframe für die Flashbox probiert und das Flash in einer externen Datei geladen (selbes Resultat), bis ich ans CSS gegangen bin. Das Problem ist das position:fixed für div#overlay. Wenn ich das rausmache, funktionierts auch im Fx immer, nicht nur manchmal.
Ist zwar ein sehr spezielles Problem und tritt nur mit dieser relativ außergewöhnlichen Anwendung auf, aber wenn mal jemand vor demselben Problem steht... ich interpretiere das so, dass zwei überlappende Elemente mit position:fixed, wobei in einem ein Flash zur Laufzeit eingebunden wird, sich mit Fx nicht vertragen. Getestet mit Fx 2.0.0.12 / Windows XP.