Community @ The Turning Gate

Support community for TTG plugins and products.

You are not logged in.

#1 2016-05-28 01:30:27

tonesshots
Member
Registered: 2012-11-22
Posts: 43

iPad screen layout behavior with backlight

I am I think rather confused about how mobiles, tablets and desktop display layouts are determined and managed. I have over the last couple of weeks developed a new site on a subdomain on my main domain. My home desktops display what I intend in a very pleasing way. I understand why a mobile phone needs to have a different approach to the layout for practical reasons and the 'hamburger'  icon replaces the navigation bar that appears on my desktop machines. However I used a tray as a sidebar on two of my pages today. I am pleased with the appearance of the layout on my desktops. When I tried to view the results on my iPad Air the tray content was not visible as the tray space was now used for the hamburger menu system.

However the screen resolution of my iPad air is even greater than my desktops. 1920 x 1200 on my desktop and 2048 x 1536 on my iPad. So I believe the iPad is more than fitted to display clearly the normal navigation as per my desktop screens. If it was possible I would like to see the hamburger system only come into play on the IPhone which is clearly too physically small for practical use in this way.

So can anyone enlighten me on this issue and can anyone advise on how I might set up backlight to achieve a desktop like screen layout on my iPad?

Offline

#2 2016-05-28 01:51:37

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,174
Website

Re: iPad screen layout behavior with backlight

When I tried to view the results on my iPad Air the tray content was not visible as the tray space was now used for the hamburger menu system.

this is intended

However the screen resolution of my iPad air is even greater than my desktops. 1920 x 1200 on my desktop and 2048 x 1536 on my iPad.

That's not how it works with retina devices. Your iPad's device resolution is still 1024px.

You can however change the page's navigation breakpoint down to 920px (under Page Layout in the template Designer). But be aware, since touch devices don't have a hover state, drop-down menus won't behave as they do on the desktop. In fact, they don't really work.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#3 2016-05-28 02:53:16

tonesshots
Member
Registered: 2012-11-22
Posts: 43

Re: iPad screen layout behavior with backlight

Thank you Rod for putting me right on the retina devices. Backlight would not accept values for the breakpoint below 1000 but at 1000 the iPad reverts to normal navigation when viewing the site. I also see what you mean about the drop down menus. They just don't appear anymore. However if I change the menu item Galleries in the Designer to Link to Album set from Non Interactive the album sets appear on the page when the top level menu item Galleries is clicked and that all seems to wok that way OK. The drop down gallery menu still works fine on my PC and if the Gallery top menu item is clicked then the page fills with album set icons to choose from so it could be seen as the best of both worlds perhaps.
Many thanks again.
Tony

Offline

#4 2016-05-28 11:40:50

Matthew
Administrator
From: San Francisco, CA
Registered: 2012-09-24
Posts: 5,550
Website

Re: iPad screen layout behavior with backlight

Hi Tony,

If you'd like a thorough explanation of the implications of Retina displays, I wrote this around the time the iPad 3 was released:
http://ce4.theturninggate.net/2012/03/2 … n-the-web/

It's dated in ways, but the technical information holds.


Campagna Pictures, http://campagnapictures.com
The Turning Gate, http://theturninggate.net

Offline

#5 2016-05-28 16:09:04

tonesshots
Member
Registered: 2012-11-22
Posts: 43

Re: iPad screen layout behavior with backlight

That was very helpful Matt. I am guilty of 'not keeping my eye on the ball' wrt to this subject and I have caught up a bit. I found the link to the Test Page in the first of your two articles appeared to me missing, it caused an Error 404.
Many thanks for the excellent précis.
Tony

Offline

#6 2016-05-29 11:23:06

Matthew
Administrator
From: San Francisco, CA
Registered: 2012-09-24
Posts: 5,550
Website

Re: iPad screen layout behavior with backlight

Thanks for pointing that out Tony. I've removed the dead links.


Campagna Pictures, http://campagnapictures.com
The Turning Gate, http://theturninggate.net

Offline

Board footer

Powered by FluxBB