Back to Top

How to Detect the Orientation of Ipad

Nowadays, Whether you’re developing a web application or an android based application, you need to use responsive design and code for the site which will be supported iPhone, iPad, Blackberry even the Android devices.Here I am going to show you how to detect the orientation of iPad and how to make changes as per orientation of iPad with javascript rather than CSS.

First Off, Ipad detects Portrait and landscape orientation.and we can go through a Media Queries with CSS3.CSS3 media queries allow us to change the layouts of the site by CSS with screen side detection.but sometimes it’s difficult to determine the orientation of Ipad device.

Must Read: Browser Detection with Joomla

For Ipad, we need to check, orientation change or detect orientation upon page loadings.Let’s have a look into the following code which give you a basic idea

onorientationchange is an event which is sent when the user changes the orientation of iOS and support on from iOS 1.1.1.

Also Read: Learn Responsive Web Design Online

For Page load event, Here I have called iPadOrientation () function on starting of code and when orientation of Ipad changed,window.onorientationchange is the orientation handling event which will call the function iPadOrientation when orientation of iPad is changed.

That’s it.

I hope this post will help you. Don’t Forget to Follow us on Twitter or Subscribe us to Get the Latest Updates.

Leave a Reply

Your email address will not be published. Required fields are marked *

Most Popular Posts

Sliding Thumbnail and Caption with jQuery

Posted on 5 years ago

Bhumi

How to Set the Time Zone in Modx

Posted on 5 years ago

Bhumi

What is Type Hinting in PHP5

Posted on 6 years ago

Bhumi

How to use Flickr API with PHP

Posted on 5 years ago

Bhumi

How to Create and Use Cookies in PHP

Posted on 1 year ago

Bhumi

Overview of ECMAScript 6 new Features

Updated 18 years ago

Bhumi

Getting started with Amazon Web Services

Updated 18 years ago

Bhumi

Facade implementation in Laravel

Updated 18 years ago

Bhumi

The Reader’s Poll – June 2015

Posted on 2 years ago

Bhumi

The Reader’s Poll – August 2014

Posted on 3 years ago

Bhumi

The Reader’s Poll – June 2014

Posted on 3 years ago

Bhumi

The Readers’ Poll – May 2014

Posted on 3 years ago

Bhumi

The Readers’ Poll – August 2013

Posted on 4 years ago

Bhumi