homepage Welcome to WebmasterWorld Guest from 54.145.182.50
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
Probelms with Android browsers
Most pages display good, problem scroll bars
jetteroheller

WebmasterWorld Senior Member jetteroheller us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 4398374 posted 7:59 pm on Dec 15, 2011 (gmt 0)

I find it complete sensless to design for screens smaller
480x320, the lowest res used at Android cell phones.

My web site shows good ad Android cell phones.

Only problem, scroll bars. They are not available at the standard Android browsers.

The sort of scoll created by

<div style=left:20;top:20;width:900;height:400;overflow:auto>

Here goes a text much higher than 400

</div>

Any strategies to deal with this problem?

 

penders

WebmasterWorld Senior Member penders us a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



 
Msg#: 4398374 posted 12:47 am on Jan 8, 2012 (gmt 0)

What currently happens in this situation on Android? Is the extended content in the DIV simply inaccessible?!

jetteroheller

WebmasterWorld Senior Member jetteroheller us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 4398374 posted 8:56 am on Jan 8, 2012 (gmt 0)

What currently happens in this situation on Android? Is the extended content in the DIV simply inaccessible?!


<div style=width:200;height:200;overflow:auto>

is handled by Android like overflow:hidden

Out of this reason, I made a redesign of the boxes
where the navigation is.

After I display the box with height:500,
I check
document.getElementById('box').scrollHeight
and change the height of the box to be complete
visible without scrolling.

Next problem, how should the box disappear?
Normal with watching the mouse

the element which activates the box
a bridge to the box
the box

When the mouse is not over one of this elements, close the box.

But a touch screen has no onmouseover

Only solution, I found

Surround the box with
<div onclick=closethebox()>

So the box can be closed by clicking outside

Google Analytics shows a great improvement in the engagement of visitors with mobile devices.

jetteroheller

WebmasterWorld Senior Member jetteroheller us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 4398374 posted 12:24 pm on Jan 8, 2012 (gmt 0)

Here some data to compare

old version of my site
All visitors 2,75 pages per visit
Mobile visitors 1,49 pages per visit

new version not optimized for Android - Dec 14 to Dec 26
All visitors 3,82 pages per visit 39% increase
Mobile visitors 1,79 pages per visit 20% increase

new version optimized for Android - Dec 27 to Jan 8
All visitors 4,09 pages per visit 7% increase, 49% against old v
Mobile visitors 2,43 pages per visit 36% increase, 63% against old v

wushuangpu



 
Msg#: 4398374 posted 5:47 am on Jan 17, 2012 (gmt 0)

thanks

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved