[gelöst] eAccordion - CSS Fehler im Opera

[Gast]

Willkommen Gast. Bitte einloggen oder registrieren.

Einloggen mit Benutzername und Passwort

[anmShinichi]

Hallo zusammen,

ich habe letzte Woche das eAccordion-Modul installiert, um mit den News-Block zuarbeiten. Funktioniert alles soweit auch super, leider gibt es aber im Opera ein Darstellungsfehler, den ich einfach melden möchte. Im Anhang gibt es das Bild dazu.

Da bei uns der Anteil der Opera-Nutzer sehr gering ist, soll das einfach nur eine Info sein, dass vielleicht die CSS angepasst werden kann. Wahrscheinlich unterstützt Opera da den einen oder anderen Style nicht :/.

Fehler: Der DIV mit Reiter-Nummer und Beschriftung wird nicht um 90° gedreht dargestellt.
Nachbildbar auch auf Entwickler-Seite.

Viele Grüße
Ronny

[comedi]

Hoi anmShinichi, 

danke für den Hinweis. Werde ich mir anschauen.

[kawaa]

New liteAccordion v2
https://github.com/nikki/liteAccordion/downloads

demo setup:
http://nicolahibbert.com/demo/liteAccordion/demo-suite.html

@++

[comedi]

Hoi zusammen, 

@ kawaa, 

danke für den Tip. Das kann ich leider für das Modul so nicht einsetzen. Ich müsste das das Modul komplett neu aufsetzen. Aber dieses Layout gefällt mir. Vielleicht machen wir daraus ein separates Modul.

@ anmShinichi, 

habe jetzt doch eine Lösung gefunden.

suche in der modules/eAccordion/style/eAccordion.css die Zeilen 15, 68, 121 und 174

Beispiel Zeile 15:

Code: [Select]  

.easy-accordion dt{margin-bottom:0;margin-left:0;z-index:5;/* Safari */ -webkit-transform: rotate(-90deg); /* Firefox */ -moz-transform: rotate(-90deg);-moz-transform-origin: 20px 0px;  /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);cursor:pointer;}

und füge vor der } folgendes ein:

Code: [Select]  

/* Opera */-o-transform: translateX(-100%) rotate(-90deg);-o-transform-origin: right top;

Jetzt noch in den Zeilen 21, 74, 127 und 180

Beispiel Zeile 21:

Code: [Select]  

.easy-accordion .slide-number{position:absolute;bottom:0;left:10px;font-weight:normal;font-size:1.1em;/* Safari */ -webkit-transform: rotate(90deg); /* Firefox */ -moz-transform: rotate(90deg);  /* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);}

und füge auch dort vor der } folgendes ein:

Code: [Select]  

/* Opera */-o-transform:rotate(90deg);

Anschauen kannst du dir das hier.

PS:  Konnte das aber nur im Opera 11.61 testen. Sollte aber bis zum Opera 10.5 funktionieren. Bei noch älteren Versionen wird es auf keinen Fall mehr funktionieren.

[comedi]

Hoi zusammen,  

wir haben diese Änderung in den aktuellen Download eingepflegt.

 

[anmShinichi]

@comedi: Vielen vielen Dank für das Update. Ich hätte die Änderungen manuell übernommen, aber so war das ja traumhaft.

Allen ein schönes Wochenende

LG
Ronny