Orientation Change & Viewport for iPad (JavaScript)

iPad Landscape

iPad Portrait

 I found out that you can detect the device orientation. I knew you can handle many cool things on the iOS, like swipes in javascript, but this one was new to me. So, what are you going to do with this? It’s obvious: Style your website or re-order your content to match exactly your iPad’s orientation ;-)
You can use javascript in an event handler, loop, or whatever by accessing window.orientation (or only orientation).
Here’s an example on how to detect the current orientation of the iPad device either by pressing a button or when the orientation changes, using an event called onOrientationChange:

Example 1

Example 2

You can also use CSS Stylesheets using the media definition:

Viewport only


Popular Posts