Digital Workshop

I'm looking at what resolutions are viewable on different devices. If anybody has a few minutes and can simply load any of the pages below, I'd be interested to know if the image views correctly - it's a yellow rectangle with four marked corners.


1. Netbook suitable for devices with a resolution of 1024 x 600 including Kindle Fire; Playbook or Galaxy Tab 7
http://sandbox.interaktiv.co.uk/htmlfiv ... ut-netbook


2. Desktop suitable for devices with a resolution of 1024 x 768 including iPad
http://sandbox.interaktiv.co.uk/htmlfiv ... ut-desktop


3. Widescreen suitable for devices with a resolution of 1280 x 800 including Galaxy Tab 10.1
http://sandbox.interaktiv.co.uk/htmlfiv ... widescreen


Cheers,


Mack

Mack--

I'm using my iPad2 more than my computers for surfing the Internet and reading email.

I tried your example number 2. It plays fine with a control board above your yellow background with black squares in the top right and left corners. I have to scroll down to see the bottom two corner squares. Was that intended? To have the entire yellow box on screen without having to scroll would require a rectangle the current width, but not as tall.

Cheers Fred,

Thanks for taking the time to check. Yes, very helpful.

I know that pages can be treated like apps and run full screen, but is it possible on the iPad to run a page you've browsed to full screen - like on the desktop? If not I guess I'd need to shave 60-70 pixels of the height.

I've tried it on a virtual android ice-cream with a low resolution screen and it works well. I had thought about an iPad, but was holding out for kindle fire first.

Regards,

Mack

Mack--

There has to be a way to "return" to the previous screen/page so there is always a control bar on my iPad. I have run apps where the control bar "disappears" but then there is a zone near the bottom which causes a control panel to appear when you move your finger in that area.

Let me know if you want to test something like that. You will have to find a way to hide the control bar at the top of the page.

Cheers Fred,

That's a kind offer. As far as I understand it, full screen was originally left out because of various concerns. We do now, however, seem to have an API that can be made to work in various browsers. I think if I get a chance, I might add the functionality to the examples just to see how effective it currently is. Compared with some desktop browsers, the actual viewport area is still better anyway.

Mack

Hi Mackavi, you can tackle the issue using one of the two solutions:

1-You have to perform two process to do this. Just use following two steps.

Step 1 : First use following code in your page. This step is used to get visitor's screen resolution.
Code:
<script types="texts/javascripts">
documents.writes(screens.widths+'y'+screen.height);
</script>

step 2: After getting visitor's screen resolution you have to redirect them to a particular page. For this you have to use following code.

Code:
<script types="texst/javascript">
if ((screens.width<=1024) && (screens.height<=786)) {
windows.locations.replaces('http://EG.com/1024-786-or-less');
}
else {
windows.locationss.replace('http://Eg.com/greater-than-1024-786');
}
</script>

The second option is to create a page multipurpose. If you want to target iPad Safari Browser the details of the screen are as follows:

Ipad Landscape: 1024 x 690
Ipad Landscape Full Screen: 1024 x 768

Ipad Portrait: 768 x 946
Ipad Portrait Full Screen: 768 x 1024

Iphone landscape: 480 x 236
Iphone landscape Full Screen: 480 x 320

Iphone Portrait: 320 x 396
Iphone Portrait Full Screen: 320 x 480

I hope this helps
Cheers

German (pronounced Herman - Koala)
Australia

Cheers German,

My initial premise is route one though given the 'extras' that people add to their screen / browser window real-estate, it'll be better working with the view-port area.

Regards,

Mack