Gunther: iOS (7) - Problem bei 'orientationchange'

Beitrag lesen

Hallo werte Selfgemeinde!

Ich arbeite gerade an einem Responsive Layout. Dazu verwende ich Media Queries und habe entsprechend verschiedene Breakpoints in meinem Layout.

Nun habe ich beim Testen folgendes Problem festgestellt:
Unter iOS (7) wenden zwar sowohl Safari, als auch Chrome, die entsprechenden Styles an, aber bei einem Orientationchange wird(werden) das(die) Element(e) nicht neu gerendert.

Das führt natürlich zu "unerwünschten" Ergebnissen.

Noch besser wird es, wenn ich testweise folgendes Script verwende:

  
function OrientChanged() {  
   $('#header').css('display', 'none');  
   alert("OrientChanged");  
   $('#header').css('display', 'block');  
}  
window.addEventListener('orientationchange', OrientChanged, false);  

Sowohl Safari, als auch Chrome zeigen zwar das Meldungsfenster an, aber das betreffende Element wird nicht aus- und wieder eingeblendet. Dementsprechend erfolgt also auch kein redraw/ repaint und somit werden die Elemente auch nicht neu dimensoniert und positioniert.

Unter Android (4.2.2) verhält sich das Skript in den von mir getesteten Browsern (Android, Chrome) wie erwartet.

Bisher ist es mir lediglich gelungen durch ein:
location.reload();
in obiger Funktion das Problem zu "lösen".

Das ist natürlich eine sehr "unschöne" Variante.

Per Google und bei SO konnte ich bis jetzt noch nichts zu dem Problem finden.

Also falls jemand diese Thematik/ Problematik kennt und mir dazu etwas sagen kann, wäre ich sehr dankbar!

Besten Dank im Voraus!

Gruß Gunther