I probably didn't look into the right places, but I was unable to find out what is the iPad's Safari window height after the debug console is activated.
For the width it's simple, it remains the standard 1024 pixels for landscape, 728 for portrait.
But what is it's standard height of the browser's viewport, with the console activated? Similar questions did not contain this seemingly simple answer
After checking with an output debug div on all the iPad generations (the first three, at the time this post is written), with iOs 5 and 6, I determined Safari's height (the visible portion that displays the website) for both orientations, with and without the debug console.
Portrait orientation
without the console: 672px
with the console: 622px
Landscape orientation
without the console: 928px
with the console: 878px
So the debug console has a height of 50 pixels, and the navigation bar 96 pixels
Related
Screenshots
I have a 10 second long animation that refreshes the page after each loop. Works fine on all other devices, but when I view it on an iPad, SOMETIMES it will look normal, but other times it will render at a smaller size, making the text too small to read. This occurs on Safari and Firefox, but Chrome on the same device does not have this bug. I looked at the window.devicePixelRatio and it was showing as '1' on all other devices, but showing as '2' on the iPad. So, I tried setting the window.devicePixelRatio to '1' with JavaScript. That didn't make any difference. Still having the same issue. Also, this only happens in Portrait Orientation, but NOT in Landscape Orientation. Any ideas?
Hello stackoverflow community,
I have just added the constraints to my iPad app and would now like that if you hold the iPad across that you can scroll the page, because not everything fits on a transverse page. If the Ipad is upright you should not be able to scroll (there everything fits).
How can I make that happen?
Edit:
I would like to be able to use landscape mode on my app, which I originally designed to be portrait only. For this I have already inserted all constraints so that the size etc. fits. Now, however, the page is so full that it no longer fits on the complete display in landscape mode. Now I would like to be able to scroll down and thus the complete page is on the display. How it looks at the moment in portrait and landscape format I have loaded into the attachment (do not wonder the app is in German).
Landscape
Portrait
add your views into UIScrollView and set its contentsize, you can thencontrol what should be visible or scrollable for both portrait and landscape
For my app's purposes I need to know all possible screen sizes when getting some content from internet. It's turned out to be hard to define screen widths for iPad Split View/Slide Over modes. F.e.: iPad Air 2 has 320px app's window width in slide over, but iPad Pro - 375px in the same mode. It's definitely not 33% of full width claimed by Apple. Thanks.
I just made an ios app through cordova, iphone app looks fine because I am using always portrait mode for iphones but for ipads I am using always landscape mode with locked rotation. The problem is when I ma build an app and run it on my ipad the landscape works fine the rotation is locked but the main issue is that I have set 100% height on body, and somehow its not working on iPad landscape. Looks like that 100% doesnt detect landscape mode and automatically was set 1024px for height because if I am set 768px height for body in inspect then the whole app looks fine as should.
Any ideas what can be the issue there ?
Don't set width and height if you set the scale
From apple doc
You do not need to set every viewport property. If only a subset of
the properties are set, then Safari on iOS infers the other values.
For example, if you set the scale to 1.0, Safari assumes the width is
device-width in portrait and device-height in landscape orientation.
In my iPad app, i am supporting only portrait mode except on one screen. I have tab bar at bottom, on click of any tab,it opens a small view of size 320.0 * 600.0, with table view. On selecting any row in small view, a full screen view opens up. Problem is that when i came on full screen view which supports all orientations, next time,my other view especially the small view comes up with frame size of 768 * 1024.
Any sugeestions or help is appreciated!
I'm guessing the problem is that you read the frame size while still being in landscape mode. If you are running things in the simulator, it probably jumps back to portrait when you dismiss the full screen? This forces the app back to "portait" mode without triggering the normal "willRotate" functionality, and could possibly mess up your code for keeping track of orientations.
Also keep in mind that most apps needs to support all orientations on the iPad to get accepted, unless you're making e.g. a game which is normally specifically designed for either landscape or portrait.