Forum Moderators: open

Message Too Old, No Replies

Combining onmouseover, onfocus, onclick and onkeypress

Links are starting to get long

         

Jeremy_H

2:22 am on Oct 11, 2006 (gmt 0)

10+ Year Member



I guess this is more of a dream than a question, still I'll ask hoping it might be possible.

I have a link that looks like this...

<a href="/.../" onmouseover="return z('a','b')" onfocus="return z('a','b')" onclick="return z('a','b')" onkeypress="return z('a','b')">...</a>

Is there a way to further optimizie this?

Originally I wanted onmouseover and onclick, but I added onfocus and onkeypress for accessibility concerns.

Since they returns are the same, can I combine them, something like this:

Pesudo Code:

<a href="/.../" on(mouseover¦focus¦click¦keypress)="return z('a','b')">...</a>

Rambo Tribble

3:52 am on Oct 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



About the only thing I can offer is that with onmouseover, onclick should be redundant, since one would have to mouseover to click. Still, the onclick event is more reliable than onmouseover, which can fail at times.

kaled

9:35 am on Oct 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I presume you have many similar links. In this case, assign the events using a for loop and the document.links array.

Kaled.

timster

1:34 pm on Oct 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



with onmouseover, onclick should be redundant

Hmm...haven't testing this, but it sound like that assumes the visitor used a mouse to activate the link.

Rambo Tribble

1:58 pm on Oct 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Onmouseover and onclick are both mouse events; onfocus would cover the case where a field was tabbed to and the enter key used simulate onclick.

Fotiman

5:51 pm on Oct 11, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



You might try using unobtrusive JavaScript to attach the events instead, keeping your markup nice and clean.

In the head of your document:


<script type="text/javascript">
function attachBehaviors() {
var az = document.getElementById('zlink');
if(!az ) return;
az.onmouseover = az.onfocus = az.onclick = az.onkeypress = function(){return z('a','b');};
}
window.onload = attachBehaviors;
</script>

And change your HTML to:


<a href="/.../" id="zlink">...</a>

penders

12:12 pm on Oct 14, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



Rambo Tribble:
About the only thing I can offer is that with onmouseover, onclick should be redundant, since one would have to mouseover to click.

timster:

...it sound like that assumes the visitor used a mouse to activate the link.

Rambo Tribble:

Onmouseover and onclick are both mouse events; onfocus would cover the case where a field was tabbed to and the enter key used simulate onclick.

I think timster is correct. The onclick event (on anchors/buttons) is not just a mouse event - it is also fired when a user tabs to a link and activates it with the keyboard. The onfocus event will fire as soon as the link is tabbed to using the keyboard - so in this respect is on a par with the onmouseover event for those using the mouse.

I would have said the onkeypress event on the anchor was superfluous in the original example, since the onclick event would also fire.

Rambo Tribble

1:08 pm on Oct 14, 2006 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Onclick is a mouse event that is simulated by a keyboard event for accessibility, as noted.