8
Lightbox2 - transparenter Hintergrund funktioniert nicht im IE
Hallo,
ich möchte gern die Lightbox2 auf meiner HTML-Seite verwenden. Allerdings ist der Bildhintergrund (also außerhalb des Bildcontainers) im IE nicht transparent (im FF klappts!). Der Code in der lightbox.css ist:
Zuvor hatte ich Thickbox verwendet, dort war der Code:
Hab schon diese Zeile in die lightbox.css eingetragen, aber ohne Erfolg.
Für Hinweise wäre ich sehr dankbar.
bigiana
ich möchte gern die Lightbox2 auf meiner HTML-Seite verwenden. Allerdings ist der Bildhintergrund (also außerhalb des Bildcontainers) im IE nicht transparent (im FF klappts!). Der Code in der lightbox.css ist:
#lightboxOverlay {
...
z-index: 9999;
background-color: black;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85 );
opacity: 0.85; ... }Zuvor hatte ich Thickbox verwendet, dort war der Code:
filter:alpha(opacity=85);Hab schon diese Zeile in die lightbox.css eingetragen, aber ohne Erfolg.
Für Hinweise wäre ich sehr dankbar.
bigiana
Share on Facebook
Share on Twitter
Share on Reddit
Share on LinkedinPlease also mark the comments that contributed to the solution of the article
Content-Key: 205783
Url: https://administrator.de/contentid/205783
Printed on: April 23, 2024 at 17:04 o'clock
8 Comments
Latest comment
Hallo,
hmm ein CSS Selektor ohne den HTML Code dazu bringt nicht wirklich was oder?
Hast du die richte jQuery Version?
Hast du irgendwelche JavaScript Fehler auf der Konsole?
Wie hast du das ganze eingebunden?
Gruß
PS.: Bitte benutze die Code-Tags
hmm ein CSS Selektor ohne den HTML Code dazu bringt nicht wirklich was oder?
Hast du die richte jQuery Version?
Hast du irgendwelche JavaScript Fehler auf der Konsole?
Wie hast du das ganze eingebunden?
Gruß
PS.: Bitte benutze die Code-Tags
also der html-code ist:
Die zugehörigen Dateien hab ich runtergeladen von:
https://lokeshdhakar.com/projects/lightbox2/
also jQuery Version 1.7.2 (min)
JavaScript Fehler erscheint nicht
<script src="jass/jquery-1.7.2.min.js"></script>
<script src="jass/lightbox.js"></script>
<link href="jass/lightbox.css" rel="stylesheet" />
...
<a href="bildvor.jpg" rel="lightbox[gallery]"><img src="bild.jpg" alt="" /></a> Die zugehörigen Dateien hab ich runtergeladen von:
https://lokeshdhakar.com/projects/lightbox2/
also jQuery Version 1.7.2 (min)
JavaScript Fehler erscheint nicht
Hallo,
in deinen 4 Zeilen HTML ist nichts auf was der oben genannte Selektor passen würde.
Gruß
in deinen 4 Zeilen HTML ist nichts auf was der oben genannte Selektor passen würde.
Gruß
Hallo,
ja, wie ich die Lightbox2 und andere html-Galerien verstehe, startet das Anklicken o.a. Links Javascripte, welche dann auf den Selektor bzw. die lightbox.css zugreifen.
Gruß bigiana
ja, wie ich die Lightbox2 und andere html-Galerien verstehe, startet das Anklicken o.a. Links Javascripte, welche dann auf den Selektor bzw. die lightbox.css zugreifen.
Gruß bigiana
Hallo,
das JS ändert nur deinen HTML Code bzw. Fügt weiteres hinzu. Und genau dort muss dann auch der Selektor drinnen stehen. Poste das doch mal.
Gruß
das JS ändert nur deinen HTML Code bzw. Fügt weiteres hinzu. Und genau dort muss dann auch der Selektor drinnen stehen. Poste das doch mal.
Gruß
Hallo,
ich glaub, nun hab ich den weiteren html-Code (also beim Bild-Anklicken) gefunden:
Und in der lightbox.css:
Gruß bigiana
ich glaub, nun hab ich den weiteren html-Code (also beim Bild-Anklicken) gefunden:
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>lightbox2 - bild durch anklicken vergrößern</title>
<script src="jass/jquery-1.7.2.min.js"></script>
<script src="jass/lightbox.js"></script>
<link href="jass/lightbox.css" rel="stylesheet">
</head>
<body>
<a href="bilder/bild137g.jpg" rel="lightbox[gallery]"><img src="bilder/bild137k.jpg" alt="Plant 1"></a>
<a href="bilder/bild140g.jpg" rel="lightbox[gallery]"><img src="bilder/bild140k.jpg" alt="Plant 1"></a>
<a href="bilder/bild141g.jpg" rel="lightbox[gallery]"><img src="bilder/bild141k.jpg" alt="Plant 1"></a>
<div style="width: 1153px; height: 857px; display: block;" id="lightboxOverlay"></div>
<div style="display: block; top: 85.7px; left: 0px;" id="lightbox">
<div style="width: 320px; height: 420px;" class="lb-outerContainer">
<div class="lb-container">
<img src="bilder/bild141g.jpg" style="display: inline;" class="lb-image">
<div style="display: block;" class="lb-nav">
<a style="display: block;" class="lb-prev"></a>
<a style="display: none;" class="lb-next"></a>
</div>
<div style="display: none;" class="lb-loader">
<a class="lb-cancel"><img src="images/loading.gif"></a>
</div>
</div>
</div>
<div style="display: block; width: 320px;" class="lb-dataContainer">
<div class="lb-data">
<div class="lb-details">
<span style="display: none;" class="lb-caption"></span>
<span style="" class="lb-number">Image 3 of 3</span>
</div>
<div class="lb-closeContainer">
<a class="lb-close"><img src="images/close.png"></a>
</div>
</div>
</div>
</div>
</body></html>Und in der lightbox.css:
/* line 6, ../sass/lightbox.sass */
#lightboxOverlay {
position: absolute;
top: 0;
left: 0;
z-index: 9999;
background-color: black;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
opacity: 0.85;
display: none;
}Gruß bigiana
Hallo,
wie wäre es mit
Gruß
wie wäre es mit
background-color: transparent;
# anstelle von
background-color: black;Gruß
Hallo,
na ja, das bewirkt, dass gar keine Farbe im Rest des Fensters erscheint.
Der Witz ist ja, dass ein Bild in der Fenstermitte angezeigt wird, und außen herum über den restlichen Inhalt eine halbdurchlässige Farbe gelegt wird.
Gruß bigiana
na ja, das bewirkt, dass gar keine Farbe im Rest des Fensters erscheint.
Der Witz ist ja, dass ein Bild in der Fenstermitte angezeigt wird, und außen herum über den restlichen Inhalt eine halbdurchlässige Farbe gelegt wird.
Gruß bigiana
