Re: Example Scrolling Div

Hi Patrick,

The issue I experienced was on an iPhone 4s / Safari.

The problem being that voiceover's visual focus tracks down through the content but does not scroll the content in the div, the focus appears to move out of the bottom of the scrollable box and down the page below the other content - scrolling the page down and down as it goes.  Once the content in the scrollable box is completely read the focus moves to the next item (the checkbox), however, the checkbox is now at the top of the page (due to the large amount of scrolling).

My experience was that the checkbox was so high up the page that when the focus shifted to it the focus was now partially over the browser's url entry box, and a double tap thinking I was on the checkbox meant that the url selection functionality was opened instead - which was very confusing.

Hope this is enough of an explanation.

In context, the example was presented in light of a conversation on gesture traps - and it was there to indicate that explore by touch may not always be a reliable mechanism to get you free - as the focus might not be where you think it should be.

Ideally, there should be a certain amount of predictability to where you think you are focused on a page - which is not the case if content such as scrollable divs are used. 

All the best 

Alistair

On 17 Nov 2015, at 10:40, Patrick H. Lauke wrote:

> On 17/11/2015 09:39, Alistair Garrison wrote:
>> Hi,
>> 
>> I mentioned a scrolling div issue during the last telecon. Kathy has
>> been very kind and placed the "de-natured" example I sent in on GitHub.
>> 
>> The code is https://github.com/kwahlbin/W3C-Mobile-Task-Force-Test
>> 
>> The live test page is
>> http://kwahlbin.github.io/W3C-Mobile-Task-Force-Test/mobile_cssTest.html
>> 
>> The scrollable div seems to work with TalkBack / Chrome / Android 4.4
>> KitKat, but not on an iPhone 4S.
>> 
>> Interested to hear your thoughts, comments, etc.
> 
> Could you define what you mean by "not working"? I am able to access all content inside the div with VoiceOver, and then proceed to the checkbox (at least on iPhone5/iOS9)
> 
> P
> -- 
> Patrick H. Lauke
> 
> www.splintered.co.uk | https://github.com/patrickhlauke
> http://flickr.com/photos/redux/ | http://redux.deviantart.com
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> 

Received on Tuesday, 17 November 2015 11:13:34 UTC