• Apfeltalk ändert einen Teil seiner Allgemeinen Geschäftsbedingungen (AGB), das Löschen von Useraccounts betreffend.
    Näheres könnt Ihr hier nachlesen: AGB-Änderung
  • Viele hassen ihn, manche schwören auf ihn, wir aber möchten unbedingt sehen, welche Bilder Ihr vor Eurem geistigen Auge bzw. vor der Linse Eures iPhone oder iPad sehen könnt, wenn Ihr dieses Wort hört oder lest. Macht mit und beteiligt Euch an unserem Frühjahrsputz ---> Klick

CSS-Problem mit dem IE&Firefox

FLU

Braeburn
Registriert
29.11.05
Beiträge
44
Hallo allerseits!

Erstmal sorry, dass ich in letzter Zeit so viel in das Forum poste aber ich bin momentan an meiner Diplomarbeit und die Zeit drängt...ich möchte an dieser Stelle auch ein riesen Kompliment an das Forum aussprechen, welches mir schon in eingen Situationen sehr geholfen hat! Ich probiere meine Erfahrungen -die noch stark am wachsen sind ;) - auch gerne in das Forum einzubringen!

Nun zu meinem Problem: Ich habe ein kleines CSS- Skribt gebastelt, welches für eine Bildergallery dient. Es wird dabei ein Pop-Up ähnliches Fenster mit dem entsprechenden Bild geöffnet. Im Safari funktioniert es perfekt! Aber beim Test auf einem PC ( :mad: ) zerreist es mir mit dem IE die ganze Tabellenstruktur und das Fenster wird nicht wie gewollt über der ganzen Struktur geladen und im Firefox passiert leider gar nichts...

Hier das CSS:

.popup
{
position:absolute;
left:200px;
top:80px;
width:400px;
height:400px;
padding:10px;
background-color:#8e9a60;
background-position: center;
background-repeat:false;
border:1px;
border-style: dashed;
border-color:#ef2121;
visibility:visible;
}

und hier die PHP- Ausgabe (nur zur Info..sollte eigentlich nicht relevant sein...sieht ein wenig komplex aus da es mit einer MySQL- Query verbunden ist und 90% nur Pfade sind ;) )

echo "<img src='./pictures/galleries/TN$seite/$zeile[TN].jpg' id='$zeile[TN]' onmousedown=\"document.images('$zeile[TN]').src='./pictures/galleries/$seite/$zeile[name].jpg' ; document.$zeile[TN].className='popup'\">"

Danke für alle Antworten & ein gutes neues Jahr!!!

Grüsse
Flu
 

stk

Grünapfel
Registriert
05.01.04
Beiträge
7.141
AW: CSS-Problem mit dem IE&Firefox

Moin,

Irgendwie ist das etwas von hinten durch die Brust ins Auge - Eine PHP-Routine, die ein JS für das CSS-Popup schreibt ?!

Ohne mich rühmen zu wollen: schau mal ob Dir die Lösung auf http://massiv-haus-bau.de/enzenhoefer-referenzen/index.php vielleicht als Inspiration weiterhilft. Schau Dir die Seite sowohl mit einem standardkonformen Browser als auch IE an, da es für den einen Workaround für ein solches PopUp-Konstrukt braucht. Wimret hab ich das aufgrund seiner Komplexität meiner Faulheit in eine separate Seite gepackt.

Gruß Stefan
 

FLU

Braeburn
Registriert
29.11.05
Beiträge
44
AW: CSS-Problem mit dem IE&Firefox

Danke für die Antwort!

GENAU WIE AUF DIENER SEITE MöCHTE ICH ES! :)

Es ist jedoch eine bildergallery die über eine MySQL- Abfrage erzeugt wird...deshalb das ganze PHP, dann brauch ich das mousedown (JS) für den Aufruf des Popup CSS...hmm hab ich mir so überlegt...weiss nicht ob es eine schlauere Lösung gibt..wahrscheinlich schon, aber das Prinzip funktioniert ;)

auf jeden fall es funktioniert im IE/Firefox nicht sauber...
 

stk

Grünapfel
Registriert
05.01.04
Beiträge
7.141
AW: CSS-Problem mit dem IE&Firefox

Moin,

wie die Bilder auf die Seite kommen - ob fix per HTML oder dynamisch per PHP aus einer DB - spielt erstmal keine Rolle. Das Mousedown brauchst Du nicht, wenn Du :hover als Pseudoklasse verwendest. Das verstehen alle Browser (auch der IE) solange der :hover auf das <a>-Tag angewendet wird. Wendest Du es (erlaubterweise) auf ein anderes Tag (wie z.B. <p> oder <li>) an steigt der IE aus und braucht einen Workaround in Form eines behaviour.htc-Scripts (-> http://www.xs4all.nl/~peterned/csshover.html), das den Hovereffekt durch eine externe JS-Routine nachbildet (dazu muß JS im IE erlaubt sein o_O).

In meinem o.g. Konstrukt habe ich daher für standardkonforme Browser die Hover-Lösung gewählt und liefere dem IE JS-Lösung für die Erzeugung eines separaten PopUp-Fensters, zusammen mit einem einfachen Link als Fallback wenn JS clientseitig deaktiviert ist. Wenn Du das ähnlich aufziehst, sollte das auch mit einer Bildergalerie aus einer MySQL-Abfrage heraus laufen.

Was Du richtigerweise machen solltest, wäre die Bilder nicht in eine Tabelle zu hängen, sondern die Positionierung der Thumbs ebenfalls über CSS herbei zu führen (da sehe ich in der Tat einen Teil der Probleme bei der Positionierung des PopUps). Dazu könnte Dir dieser Artikel ggf. helfen: http://www.webreference.com/programming/css_gallery/. Obwohl ich innerhalb des <li>-Konstrukts aus semantischen Gründen eine Definitionlist (<dl>) für die Beziehung von <img> und Bildtitel (Autor, Copyright, ...) für angezeigt halte. Die von (dem ansonsten genialen) Stu Nicolls gewählte Lösung mit <br /> finde ich nicht so gelungen.

Gruß Stefan
 
Zuletzt bearbeitet:

Nathea

Admin
AT Administration
Registriert
29.08.04
Beiträge
15.099
AW: CSS-Problem mit dem IE&Firefox

stk schrieb:
... und braucht einen Workaround in Form eines behaviour.htc-Scripts (-> http://www.xs4all.nl/~peterned/csshover.html), das den Hovereffekt ...

Schlingel! ;)

Ich wollte dies Konstrukt auch anschauen, interessehalber. Aber der Link lief immer ins Leere :-c Hab erst durch copy'n'paste herausgefunden, woran es haperte.

Könntest Du vielleicht die "Klammer zu" aus dem Link-Text entfernen?

Lieben Gruß,
Sylvia
 

stk

Grünapfel
Registriert
05.01.04
Beiträge
7.141
AW: CSS-Problem mit dem IE&Firefox

Moin,

Huch, … done!
BTW: sehr geil, das neue Interface für's Editieren :) Thx Gerd!

Gruß Stefan