iPad löst nicht Resize Event von vertikal nach horizontal?

Question

Hat jemand dieses Verhalten bemerkt? Ich versuche ein Skript zu schreiben, das bei einer Größenänderung ausgelöst wird. Es funktioniert gut auf normalen Browsern, funktioniert gut auf dem iPhone, aber auf dem iPad, löst nur vom horizontalen zum vertikalen Ansichtsfenster, nicht umgekehrt.

Hier ist der Code:

$(window).resize(function() { 

    var agent=navigator.userAgent.toLowerCase(); 
    var is_iphone = ((agent.indexOf('iphone') != -1)); 
    var is_ipad = ((agent.indexOf('ipad') != -1)); 

    if(is_iphone || is_ipad){ 
     location.reload(true); 
    } else {  
     /* Do stuff. */ 
    }; 
}); 

Answer 1

Wenn ich Sie richtig verstanden habe, möchten Sie etwas tun, wenn der Benutzer das iPad kippt. Hier gehen Sie:

window.onorientationchange = function(){ 

    var orientation = window.orientation; 

    // Look at the value of window.orientation: 

    if (orientation === 0){ 

     // iPad is in Portrait mode. 

    } 

    else if (orientation === 90){ 

     // iPad is in Landscape mode. The screen is turned to the left. 

    } 


    else if (orientation === -90){ 

     // iPad is in Landscape mode. The screen is turned to the right. 

    } 

} 

Answer 2

The only thing I could find from apple:

Safari auf dem iPad und Safari auf dem iPhone haben nicht veränderbare Fenster. In Safari auf iPhone und iPad wird die Fenstergröße auf die Größe des Bildschirms eingestellt (abzüglich der Steuerelemente der Safari-Benutzeroberfläche) und kann vom Benutzer nicht geändert werden. Um sich auf einer Webseite zu bewegen, ändert der Benutzer die Zoomstufe und die Position des Ansichtsfensters, während er doppelt tippt oder klickt, um zu vergrößern oder zu verkleinern, oder indem er die Seite schwenkt und berührt, um sie zu schwenken. Wenn ein Benutzer die Zoomstufe und die Position des Ansichtsfensters innerhalb eines sichtbaren Inhaltsbereichs mit fester Größe (das heißt, das Fenster) ändert. Dies bedeutet, dass Webseitenelemente, deren Position im Ansichtsfenster fixiert ist, außerhalb des sichtbaren Inhaltsbereichs außerhalb des Bildschirms angezeigt werden.

Ich verstehe die "funktioniert auf dem iPhone" -Teil ... aber vielleicht ist es nicht mehr? Dies könnte eine Änderung in OS/mobile Safari seit dem letzten veröffentlichten iPhone OS-Release sein (die obige Dokumentation ist von März 2010).

Ich werde diese Frage erneut anfügen, indem ich das iPhone hinzufüge, vielleicht kann einer der Leute mit der Entwickler 4.0 OS-Version das testen? Wenn es der Fall ist, wurde es entfernt, dies sollte ein Fehler sein, der archiviert wird, bevor es live geht ... Ich bin mir nicht sicher, wie die Verfahren dazu bei Apple sind.

Answer 3

Ich denke, was Sie würden wollen die iPad Orientation CSS zu verwenden, die wie folgt aussieht:

<link rel="stylesheet" media="all and (orientation:portrait)" href="portrait.css" /> 
<link rel="stylesheet" media="all and (orientation:landscape)" href="landscape.css" /> 

Auch die orientationchange Ereignis ausgelöst wird, wenn die Ausrichtung geändert wird, nach iPad web development tips.

Zusammen sollte das Ihnen Werkzeuge genug geben, um mit der Änderung fertig zu werden.

Answer 4

Überprüfen Sie Ihre Version von iOS.

Die Veranstaltung "orientationChange" funktioniert nicht 3. * in iOS, aber es funktioniert in 4. *

Answer 5

1. einen schönen Scheck tun, wenn Ihre Plattform iPad ist,

2. das iOS-spezifischen Ereignis behandeln orientationChange durch den Fang window.onorientationchange

   if(navigator.platform == 'iPad') { 
       window.onorientationchange = function() { 
        // handle orientationchange event 
        // (here you can take advantage of the orientation property 
        //  - see the good answer above by Vincent) 
       }  
   } 
   

Answer 6

Sie wollen dieses Update für die Orientierung Bug auf iphone ein nd ipad. lesen Sie hier: http://www.blog.highub.com/mobile-2/a-fix-for-iphone-viewport-scale-bug/

Github neueste Version hier: https://gist.github.com/901295 auf der Seite der zweiten Version.

Answer 7

Dies beinhaltet alle Orientierungen.

sind hier zwei Möglichkeiten:

window.onorientationchange = function() { 

    var orientation = window.orientation; 

    // Look at the value of window.orientation: 

    if (orientation === 0) { 
    // iPad is in Portrait mode. 

    } else if (orientation === 90) { 
    // iPad is in Landscape mode. The screen is turned to the left. 

    } else if (orientation === -90) { 
    // iPad is in Landscape mode. The screen is turned to the right. 

    } else if (orientation === 180) { 
    // Upside down portrait. 

    } 
}  

oder

// Checks to see if the platform is strictly equal to iPad: 
    if(navigator.platform === 'iPad') { 
      window.onorientationchange = function() { 

      var orientation = window.orientation; 

      // Look at the value of window.orientation: 

      if (orientation === 0) { 
      // iPad is in Portrait mode. 

      } else if (orientation === 90) { 
      // iPad is in Landscape mode. The screen is turned to the left. 

      } else if (orientation === -90) { 
      // iPad is in Landscape mode. The screen is turned to the right. 

      } else if (orientation === 180) { 
      // Upside down portrait. 

      } 
      }  
     }