//Determine the horizontal and vertical screen status of the phone:
function hengshuping () {
if (window.orientation == 180 || window.orientation == 0) {
alert ("Vertical screen status!")
if (window.orientation == 90 || window.orientation ==-90) {
alert ("Horizontal screen status!")
window.addeventlistener ("onorientationchange" in window?"orientationchange":"resize", hengshuping, false);

//Mobile browsers generally support the window.orientation parameter,This parameter can be used to determine whether the phone is in the horizontal or vertical screen state.

Therefore, the corresponding procedures are executed according to actual needs.By adding a listener event onorientationchange, execution can be done.

In the development of ipad and iphone web pages,We will most likely need to determine whether it is landscape or portrait.

The following describes how to use jquery to determine whether the iPad, iPhone, and Android are horizontal or vertical.

function orient () {
if (window.orientation == 90 || window.orientation == -90) {
//ipad, iphone vertical screen;andriod horizontal screen
$("body"). attr ("class", "landscape");
return false;
else if (window.orientation == 0 || window.orientation == 180) {
//ipad, iphone horizontal screen;andriod vertical screen
$("body"). attr ("class", "portrait");
return false;
//Called when the page loads
$(function () {
orient ();
//Called when the user changes the screen orientation
$(window) .bind ("orientationchange", function (e) {
orient ();

The window.orientation value corresponding to the screen orientation:

iPad:90 or -90 landscape

iPad:0 or 180 portrait

andriod:0 or 180 landscape

andriod:90 or -90 portrait

  • Previous AngularJS basic ng-keypress directive simple example
  • Next Python implements SMTP sending email detailed tutorial