Your Ad Here

advanced code snippet search

Posted By

anvilcity on 07/28/10


Tagged


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

robotici


iPhone orientation script

 / Published in: JavaScript
 

URL: http://net.tutsplus.com/tutorials/tools-and-tips/learn-how-to-develop-for-the-iphone/

Switches stylesheets depending on orientation of iPhone (landscape vs.portrait).

Expand | Embed | Plain Text 
  1. Link to initial stylesheet, with ID:
  2.  
  3. <link rel="stylesheet" type="text/css" media="screen" href="<?php bloginfo('stylesheet_directory'); ?>/css/iphone-portrait.css" id="orient_css">
  4.  
  5. Script in <head>:
  6.  
  7. <script type="text/javascript">
  8. 	function orient() {
  9. 		switch(window.orientation){
  10. 				case 0: document.getElementById("orient_css").href = "<?php bloginfo('stylesheet_directory'); ?>/css/iphone-portrait.css";
  11. 				break;
  12.  
  13. 				case -90: document.getElementById("orient_css").href = "<?php bloginfo('stylesheet_directory'); ?>/css/iphone-landscape.css";
  14. 				break;
  15.  
  16. 				case 90: document.getElementById("orient_css").href = "<?php bloginfo('stylesheet_directory'); ?>/css/iphone-landscape.css";
  17. 				break;
  18. 		}
  19. 	}
  20. 	window.onload = orient();
  21. </script>
  22.  
  23. Then init from the <body> tag:
  24.  
  25. <body class="iphone" onorientationchange="orient();">

Report this snippet  

You need to login to post a comment.