[ https://issues.apache.org/jira/browse/CB-7549?page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel&focusedCommentId=14134766#comment-14134766 ]
Shazron Abdullah edited comment on CB-7549 at 9/16/14 12:45 AM: ---------------------------------------------------------------- No repro. I created a new cordova-ios project on an iOS 8 GM device (iPhone 5s) and the layout looks fine. I set the orientation to only the two Landscape settings. Note that I modified your sample to use the CDN based versions of jquery and jqm was (Author: shazron): No repro. I created a new cordova-ios project on an iOS 8 GM device (iPhone 5s) and the layout looks fine. Note that I modified your sample to use the CDN based versions of jquery and jqm > iOS8 Landscape issue > -------------------- > > Key: CB-7549 > URL: https://issues.apache.org/jira/browse/CB-7549 > Project: Apache Cordova > Issue Type: Bug > Components: iOS > Affects Versions: 3.5.0 > Environment: Jquerymobile 1.4.3, Jquery 2.0.3, cordova 3.5 ios > Reporter: Tim Higgins > Assignee: Shazron Abdullah > > not for sure if this is an xcode setting, cordova ios8 issue or jquerymobile > ios8 issue. if you create a new cordova project, force it to Landscape > only(phone or ipad doesnt matter), then include JqueryMobile (1.4.3) and run > the project in iOS 8 the display will be chopped up into 3 sections. ReRun > it in iOS 7 simulator and everything is fine. so it has something to do with > being forced to Landscape. enclosed is the code i am using to recreate the > problem. > {code} > <!DOCTYPE html> > <html> > <head> > <title></title> > <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, > user-scalable=no" /> > <meta name="msapplication-tap-highlight" content="no" /> > <meta name="format-detection" content="telephone=no" /> > <meta charset="utf-8"> > > <link rel="stylesheet" > href="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.css"> > > </head> > > > <style type="text/css"> > > div.div_Body { > height: 100%; > > position: relative; > border:2px solid DarkGoldenrod; > border-radius:7px; > font: bold 14px Arial; > font-family:Arial, Helvetica, sans-serif; > color:Black; > text-align:center; > background: #FFFFFF; > } > </style> > > > > <body id="body" class="noselect" > > <script> > > window.addEventListener('load', function () { > document.addEventListener('deviceready', function () {onDeviceReady() }, > false); }, false); > > /* When this function is called, PhoneGap has been initialized and > is ready to roll */ > function onDeviceReady() > { > console.log("in device ready"); > console.log("height " + screen.height); > console.log("width " + screen.width); > var myscreenWidth = screen.width; > } > </script> > > > <div data-role="page" class="ui-page " data-theme="b" > > > <div data-role="header" class="ui-header" data-theme="b" > > <h1 class="ui-title" tabindex="0" role="heading" > aria-level="1">Test</h1> > </div> > <div data-role="content" style="height: 670px" class="ui-content > div_Body" role="main"> > <p >Send Help</p> > </div> > </div> > > <script type="text/javascript" charset="utf-8" > src="cordova.js"></script> > <script src="http://code.jquery.com/jquery-1.9.1.js"></script> > <script > src="http://code.jquery.com/mobile/1.4.3/jquery.mobile-1.4.3.min.js"></script> > </body> > </html> > {code} -- This message was sent by Atlassian JIRA (v6.3.4#6332)