[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1846
  • Last Modified:

Can You Force iPhone's Safari Into Landscape Mode...?

Hello Everyone,
  Thanks for taking a look at my question. So, I'm the web designer for a small company and I'm currently developing (and close to launching) a mobile website for our company. However the text gets cut over, and returned putting complete sentences on three lines and things like that. So I was wondering if there is a way that I can force Safari into landscape mode so the user will turn their phone and see everything properly?

Much Thanks,
  Jason Eyerly
0
CaptainNegatory
Asked:
CaptainNegatory
  • 3
  • 2
1 Solution
 
CaptainNegatoryAuthor Commented:
No this will not work. I need the users browser to lock itself in landscape mode, not my own phone.
0
Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

 
CaptainNegatoryAuthor Commented:
These will also not work. I'm just building a webpage, and I need Safari to rotate to landscape mode. This has nothing to do with any apps, or C++.
0
 
Paul-BCommented:
Sorry about that, basically the answer is no.. but you could rotate your content with CSS on orientation change.. something like ...

$(document).ready(function () {
     $(window)    
          .bind('rotateContent', function(){
               if (window.orientation % 180 == 0){
                   $(document.body).css("-webkit-transform-origin", "")
                       .css("-webkit-transform", "");               
               } 
               else {                   
                   if ( window.orientation > 0) { 
                     $(document.body).css("-webkit-transform-origin", "980px 460px")
                       .css("-webkit-transform",  "rotate(-90deg)");  
                   }
                   else {
                     $(document.body).css("-webkit-transform-origin", "460px 980px")
                       .css("-webkit-transform",  "rotate(90deg)"); 
                   }
               }
           })
          .trigger('rotateContent'); 
  }

Open in new window

0
 
CaptainNegatoryAuthor Commented:
Thanks! I was able to make this work sufficiently enough for our needs!
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now