Advanced Search

iPad/iPhone Orientation Body Class

/ Published in: jQuery
Save to your folder(s)
This function will detect the orientation (portrait/landscape) of an iOS device and set the body class to either portrait or landscape, as well as providing a global variable for use elsewhere in your JS.

If you require multiple classes on your body tag, simply alter the code to use jQuery's addClass() and removeClass() functions.

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. function orient() {  
  2.     if (window.orientation == 0 || window.orientation == 180) {
  3.     	$("body").attr("class", "portrait");
  4. 	orientation = 'portrait';
  5.  
  6.     	return false;
  7.     }
  8. 	else if (window.orientation == 90 || window.orientation == -90) {
  9.     	$("body").attr("class", "landscape");
  10.     	orientation = 'landscape';
  11.  
  12.     	return false;
  13.     }
  14. }
  15.  
  16. /* Call orientation function on page load */
  17. $(function(){
  18. 	orient();
  19. });
  20.  
  21. /* Call orientation function on orientation change */
  22. $(window).bind( 'orientationchange', function(e){
  23. 	orient();
  24. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.