HTML_Felix
Neues Mitglied
Ich habe eine Seite, wo sich Kacheln drehen. (hisvoice.de)
Mein Problem: Unter iOS klappt das nicht. Die rotierte Seite ist weiß. Ich konnte den Fehler einkreisen. Ich rotiere zweifach: Einen äußeren Div, damit sich die Kachel überhaupt dreht und einen inneren Div, damit nicht der neue Inhalt spiegelverkehrt ist. Anscheinend kommt iOS nicht damit klar.
Ich habe das Problem auf einen simplen Code reduzieren können:
<html>
<body>
<div style="height:200px;width:200px;background-color:#456; -webkit-transform:rotateY( 180deg );transform:rotateY( 180deg );">
<div style="height:180px;width:180px;background-color:#f56; -webkit-transform:rotateY( 180deg );transform:rotateY( 180deg );"><h1>Juhu</h1></div>
</div>
</body>
</html>
Das gibt es nochmals auch online:
http://hisvoice.de/test.html
Diese doppelte Rotation klappt unter Win10 in den folgenden Browsern: Chroma, FF, IE, sogar Safari
Aber nicht auf iOS Geräten. Gibt es da eine Idee?
Danke
Felix
Mein Problem: Unter iOS klappt das nicht. Die rotierte Seite ist weiß. Ich konnte den Fehler einkreisen. Ich rotiere zweifach: Einen äußeren Div, damit sich die Kachel überhaupt dreht und einen inneren Div, damit nicht der neue Inhalt spiegelverkehrt ist. Anscheinend kommt iOS nicht damit klar.
Ich habe das Problem auf einen simplen Code reduzieren können:
<html>
<body>
<div style="height:200px;width:200px;background-color:#456; -webkit-transform:rotateY( 180deg );transform:rotateY( 180deg );">
<div style="height:180px;width:180px;background-color:#f56; -webkit-transform:rotateY( 180deg );transform:rotateY( 180deg );"><h1>Juhu</h1></div>
</div>
</body>
</html>
Das gibt es nochmals auch online:
http://hisvoice.de/test.html
Diese doppelte Rotation klappt unter Win10 in den folgenden Browsern: Chroma, FF, IE, sogar Safari
Aber nicht auf iOS Geräten. Gibt es da eine Idee?
Danke
Felix