WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Javascript Rollovers and accessibility

for

Number of posts in this thread: 5 (In chronological order)

From: chet
Date: Tue, Jan 21 2003 6:12AM
Subject: Javascript Rollovers and accessibility
No previous message | Next message →

Hi,

I read previous posts, but can't seem to get a clear answer to my question.
If i am using graphics as links and want a rollover effect on them (i.e they swap images using javascript) - does this meet accessibility requirements?

Reading W3C & other guidelines I believe that using javascript for rollovers (i.e visual effect only) does not require any additional accessibility techniques (although i would use the <noscript> to let users with javascript turned off that it is not conveying essential info).

I am not talking about drop down menu's that i understan

From: Mark Rew
Date: Tue, Jan 21 2003 6:22AM
Subject: Re: Javascript Rollovers and accessibility
← Previous message | Next message →

My experience is that these rollovers are not accessible to someone who does not use a mouse such as a screen reader user.

Either provide a set of separate links or a separate page without rollovers. After accessibility problems, and other problems with different browsers and equipment not being able to use the rollovers my shop redesigned our pages so rollovers are not needed.

Mark Rew

----- Original Message -----
From: chet
To: = EMAIL ADDRESS REMOVED =
Sent: Tuesday, January 21, 2003 7:59 AM
Subject: Javascript Rollovers and accessibility


Hi,

I read previous posts, but can't seem to get a clear answer to my question.
If i am using graphics as links and want a rollover effect on them (i.e they swap images using javascript) - does this meet accessibility requirements?

Reading W3C & other guidelines I believe that using javascript for rollovers (i.e visual effect only) does not require any additional accessibility techniques (although i would use the <noscript> to let users with javascript turned off that it is not conveying essential info).

I am not talking about drop down menu's that i understand aren

From: Laurie Davis-Covin
Date: Tue, Jan 21 2003 6:48AM
Subject: Re: Javascript Rollovers and accessibility
← Previous message | Next message →

Not javascript, but this might work for you.


<table cellpadding="5" cellspacing="1" width="100%" bgcolor="navy"
summary="for layout only">
<tr>
<td align="center" valign="middle" bgcolor="#ffcc00" title="museum home"
onmouseover="bgcolor='#6666cc';" onmouseout="bgcolor='#ffcc00';"
width="20%"> <a href="xxindex.htm" class="table">museum home</a><br></td>

<td align="center" valign="middle" bgcolor="#ffcc00" title="featured
exhibit" onmouseover="bgcolor='#6666cc';" onmouseout="bgcolor='#ffcc00';"
width="20%"><a href="../../whats_new.html" class="table">featured
exhibit</a><br></td>

<td align="center" valign="middle" bgcolor="#ffcc00" title="continued
exhibits" onmouseover="bgcolor='#6666cc';" onmouseout="bgcolor='#ffcc00';"
width="20%" class="topnav">continued exhibits<br></td>

<td align="center" valign="middle" bgcolor="#ffcc00" title="photo gallery"
onmouseover="bgcolor='#6666cc';" onmouseout="bgcolor='#ffcc00';"
width="20%"><a href="../../info_desk.html" class="table">photo
gallery</a><br></td>

<td align="center" valign="middle" bgcolor="#ffcc00" title="museum
facts" onmouseover="bgcolor='#6666cc';" onmouseout="bgcolor='#ffcc00';"
width="20%"><a href="..html" class="table">museum facts</a><br></td>

</table>



At 12:59 PM 1/21/2003 +0000, you wrote:
>Hi,
>
>I read previous posts, but can't seem to get a clear answer to my question.
>If i am using graphics as links and want a rollover effect on them (i.e
>they swap images using javascript) - does this meet accessibility requirements?
>
>Reading W3C & other guidelines I believe that using javascript for
>rollovers (i.e visual effect only) does not require any additional
>accessibility techniques (although i would use the <noscript> to let users
>with javascript turned off that it is not conveying essential info).
>
>I am not talking about drop down menu's that i understand aren't generally
>accessible (if at all?).
>
>Also, If anyone has used javascript rollovers and complied with
>accessibility can i have a look as an example?
>
>Thanks,
>Chet (UK).

Laurie Davis-Covin, Writer/Editor
National Institute of Standards and Techno

From: Andrew Johns
Date: Tue, Jan 21 2003 6:57AM
Subject: Re: Javascript Rollovers and accessibility
← Previous message | Next message →

> If i am using graphics as links and want a rollover effect on
> them (i.e they swap images using javascript) - does this
> meet accessibility requirements?


Generally in my experience, the rollover effect has been nothing more than for presentational effect, so anyone with javascript turned off or didn't support could still click the link, or navigate to it on a keyboard and access the information behind it, and would ignore the onmouseover/onmouseout, and onfocus/onblur events

From: Mark Rew
Date: Tue, Jan 21 2003 7:10AM
Subject: Re: Javascript Rollovers and accessibility
← Previous message | No next message

If the rollovers are only for presentation affects then accessibility is not negatively impacted. The problem we had was when web designers used rollovers to add buttons to graphics. people navigating with the key board was not able to bring these additional selections up. The weather.gov site is still using rollovers for changing colors. The screen reader ignores this feature.

Mark Rew
----- Original Message -----
From: Andrew Johns
To: = EMAIL ADDRESS REMOVED =
Sent: Tuesday, January 21, 2003 8:45 AM
Subject: Re: Javascript Rollovers and accessibility


> If i am using graphics as links and want a rollover effect on
> them (i.e they swap images using javascript) - does this
> meet accessibility requirements?


Generally in my experience, the rollover effect has been nothing more than for presentational effect, so anyone with javascript turned off or didn't support could still click the link, or navigate to it on a keyboard and access the information behind it, and would ignore the onmouseover/onmouseout, and onfocus/onblur events.

A