Transparenter Hintergrund bei Lightbox
#1
Hallo Rolleyes

Ich habe ein kleines Projekt für eine Bekannte übernommen und möchte die Seite etwas aufpeppen.

Die Seite ist in php programiert worden.

Die Lightbox habe ich soweit einbetten können, nur mit dem transparenten Hintergrund beisse ich mir leider die Zähne aus. Das Problem liegt darin, dass er die Transparenz leider nur über einen Teil der Seite streckt, so dass es zu einer unschönen Gestaltung kommt. Ich habe bereits auf anderen Seiten Lightbox benutzt, da habe ich dieses Probelm nicht.

Jemand meinte es hätte was mit dem I7 zu tun, doch das kann es ja nicht so ganz sein.

Kann mir jemand einen Tipp geben?

Hier der Link zu angucken:

http://www.dance-factory-celle.de/media/index.php

Vielen Dank.
Zitieren
#2
Hi,

einfach eine andere nehmen, Auswahl ist reichlich vorhanden
http://www.ajaxrain.com/tagcloud.php?tag=lightbox

Cu Helmut
Zitieren
#3
Hi.

Ich habe ein Script in Arbeit, das mit der original Lightbox 2.03a arbeitet. Bisher fehlerfrei. Hier der Link::

http://www.dynamicdrive.com/dynamicindex.../index.htm

Bei Google gibt es unter

http://www.google.com/search?q=dynamic+d...lz=1I7ADBF

den Hinweis, das die Version irgendein Problem mit einer Google Software hat. Bei dynamic drive gibt es auch eine Version 2.04, mit etwas anderen Links.

Irgendeine wird schon laufen. Ich hab nicht in deinen Quelltext geguckt, normalerweise füllt die lightbox den ganzen screen, es sei denn sie läuft in einem iFrame oder DIV.


cu
Beagle
Zitieren
#4
Hallo,

Zitat:Irgendeine wird schon laufen. Ich hab nicht in deinen Quelltext geguckt, normalerweise füllt die lightbox den ganzen screen, es sei denn sie läuft in einem iFrame oder DIV.

Also ich verwende bereits die Version 2.04, daher kann ich das als mögl. Fehlerquelle ausschließen.

Was meinst du genau mit einem iFrame oder DIV.

Kann ich dir irgendwelche Informationen bereitstellen, dass du erkennst, wo die Wurzel des Übels liegt?

Bin total verzweifelt hier, hab sowas noch nicht erlebt.

Kleiner Nachtrag, diese Seite ist im Gegensatz zu dem, was ich vorher gemacht habe etwas anders aufgebaut. Hier werden offenkundig Hintergründe, Menueschaltflächen über seperate Dateien geregelt. Diese befinden sich in einem Ortner Namens "assets". Darin enthalten sind m.js, s.php, sf.css, sm.css und eine ssv.css. Kann das Problem damit zusammenhängen? Ich habe diese Strucktur vorher noch nicht verwandt, daher bin ich da etwas unwissend.

Danke
Zitieren
#5
Na ja, du solltest vielleicht etwas SelfHTML studieren, wenn du nicht weisst was ein iFrame und ein DIV Container ist.

Vom Prinzip her sind das umschließende Elemente, ähnlich (verzeihung) einer Tabellenzelle. wenn die Lightbox in so einer "Zelle" aufgrufen wird, geht sie halt nur bis zum Rand. Das was dann überbleibt ist Farbe vom Background.

assets -- hört sich an wie ein Homepage Generator.

Habe mal in deinen Sourcecode geguckt. Also erst einmal gehören die Script Aufrufe in den Head einer Seite und nicht vor die HTML Deklaration. Genauso die Style Angaben.

Es gibt auch diverse Syntax Fehler wie so was hier : <td width="180 so müsste das heissen : <td width="180"

Du solltest die Seite also erst mal validieren.





Die Breite der lightbox im IE7 geht bei mir über den ganzen Bildschirm. Nur die Höhe ist abgeschnitten.

Irgendwie frag ich mich wie du das programmiert hast, wenn du die Begriffe DIV nicht kennst. Der Code ist voll davon. MrGreen

Genau hab ich das bei dem Code auch noch nicht raus. Aber die lightbox läuft möglicherweise in irgendeinem Container (Zelle) der nicht bis zum unteren Bildschirmrand geht.


Ich komm noch nicht drauf. Als erstes solltest du den Code mal validieren, wenn die Fehler raus sind, sieht die Sache möglicherweise ja schon anders aus. Irgendwie hast du 16 Fehler in der Seite.

Hier der Link zum Validator: http://validator.w3.org


Viel Erfolg :daumen:




Achso. Sehe gerade die Seite wird als HTML 3.02 angezeigt. Das solltest du mindestens in HTML 4.01 Transitional ändern.
Zitieren
#6
hi, vielen dank für die antworten.

na ja vielleicht hätte ich ja auch mal schreiben können, das ich hier nicht gerade der crack bin :icon_troest:

ich gehe da eher etwas prakmatisch vor. ich nutze adobe dreamweaver und namo zu erstellung von seiten und bewege mich da ehr etwas nach dem baukastenprinzip, bzw. versuche zu verstehen was dort gemacht worden ist in gehe dann logisch vor. somit wird es für mich einfachen, was dort gemacht worden ist und was es bewirkt. learning bei doing halt.

ich verstehe leider nicht alle codes und weiß manchmal auch nicht was sie bedeuten, bzw. bewirken. bis dato klappte das ja auch immer ganz gut, aber bei diesem seitenaufbau komme ich nicht so ganz zurecht.

ich habe diese seite nicht gemacht, ich wollte sie nur etwas verschönern, bzw. modifizieren. hat bei all meinen projekten auch ganz gut geklappt, aber hier.. na ja man wächst halt mit der aufgabe, da muss ich halt noch etwas mehr büffeln, und das in meinem alter, lol

ich werde jetzt mal versuchen das ganze etwas mehr aus der tiefe zu betrachten, vielleich komme ich dann auf den fehler.

danke aber an alle.

p.s. ich hoffe ich darf trotzdem gelegentlich noch ein paar fragen posten.

gruß
Oliver
Zitieren
#7
Hallo, ich hier nochmal.

So leider habe ich das Problem immer noch nicht gelöst, aber immerhin schon die Ursache dafür gefunden.

Also in der index.php sind folgende Zeilen enthalten:

<div id="main">
<div id="maintop"></div>
<div id="content">
<div id="youarehere">
<a href="../index.php">Startseite</a>
/ <a href="./index.php">Media</a></div>

Diese weisen auf eine Einstellung hin, die in einer css Datei hinterlegt sind.

#main {
position: absolute;
top: 50px;
left: 172px;
width: 800px;
height: auto;

Deaktiviere ich den Main-Befehl in der php Datei, verschieben sich zwar alle Elemente, aber der transparente Hintergung füllt nun die gesamte Seite des Explorers aus.

Nun habe ich schon einige Einstellungen probiert, bekomme aber nicht das gewünschte Ergebnis.

Vielleicht hat jemand nun einen guten Tipp für mich.

Vielen Dank


Angehängte Dateien
.txt   sm.txt.txt (Größe: 9,32 KB / Downloads: 2)
Zitieren
#8
Schreib anstatt height: auto; mal folgendes in die #main {

Code:
min-height:       100%;
height:           auto;

dann darunter für den IE6 (den Sternchen Hack)
Code:
* html #main {
height:           100%;
}

Dann such noch in den CSS, ob du da Angaben für html und body findest. Sollte in der ersten CSS stehen, die dein html Code aufruft, sonst ergänz es. Da schreib noch mal rein::
Code:
html, body {                    
height:           100%;
margin:           0 0 0 0;
padding:          0 0 0 0 ;
}

Falls bei html und body wieder height : auto; steht, lösch es.


Normalerweise checken die Browser dann alle, dass mit 100% Bildschirmhöhe gearbeitet werden soll. Ich sagte ja, die Lightbox läuft vermutlich in einem begrenzenden Element.

Viel Erfolg...Beagle
Zitieren
#9
Hi,

ha hab einiges geändert und ergänzt, leider noch kein positives ergebnis.

was meinst du mit "(den Sternchen Hack)", das hab ich nicht ganz verstanden.

Danke
Zitieren
#10
Hallo,
ich verwende dioe lightbox auch, allerdings eine andere Version so wies aussieht.

Wenn der Inhalt größer ist als eine Bildschirmanzeige (also scrollbar) dann deckt der IE ( 6 & 7) das nicht ab. Firefox hat damit gar keine Probleme...

Ich habe es so gelöst für den IE:
(zwar hab ich dann im Firefox zu viel "Overlay", aber das ist mir egal ;-)

Änder mal im lightbox.js folgende 2 Dinge:
(im Original steht dort 'px', das ersetzt du nun durch zB. die Zahl 400 , dann sollte es reichen bis zum unteren Bildrand.)




Code:
// stretch overlay to fill page and fade in
        var arrayPageSize = this.getPageSize();
        $('overlay').setStyle({ width: arrayPageSize[0] + 'px' , height: arrayPageSize[1] + [B][color=DarkRed]400[/color][/B]});

und weiter unten noch:
Code:
duration: this.resizeDuration,
                afterFinish: (function() {
                    // update overlay size and update nav
                    var arrayPageSize = this.getPageSize();
                    this.overlay.setStyle({ height: arrayPageSize[1] + [B][color=DarkRed]400[/color][/B] });
                    this.updateNav();

PS: keine Garantie, da ich absoluter Laie bin und ich wie gesagt ne andere Version am Laufen habe.
Habs durch googlen und probieren so hinbekommen dass es bei mir funktioniert :tease:

toi toi toi
Zitieren



Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Teil Hintergrund an eine ganze Seite anpaqssen? Willy 4 3.667 23.09.2007, 20:52
Letzter Beitrag: Willy
  Leicht transparenter Hintergrund bei... lebus 7 3.801 13.08.2007, 13:29
Letzter Beitrag: lebus
  Wie bekomme ich den Hintergrund Fix? Elbenhexe 1 1.372 23.11.2006, 20:53
Letzter Beitrag: Elbenhexe
  Hintergrund über CSS udog 2 2.083 30.03.2004, 21:30
Letzter Beitrag: udog