Home | Contact Us | FAQ | Search & Site Map | Link to Us
Sign In | Join | Other 45 Sites in Network
Home
Discussion GroupsGeneralPHPASPPerlColdFusionFlashHTML, CSS, ScriptsBrowsers

Webmaster Forum / HTML, CSS, Scripts / JavaScript / July 2005



Tip: Looking for answers? Try searching our database.

Safari, key[down|up] with cursor keys

Thread view: 
Enable EMail Alerts  Start New Thread
Thread rating: 
inevercheckthisaddress@hotmail.com - 28 Jul 2005 20:36 GMT
I'm writing some stuff where I wish to allow the cursor keys to control
elements in a page. This has not been a problem except with Safari
which appears to duplicate the keydown and keyup events which are fired
when the cursor keys are pressed. I.e. pressing and releasing say, K,
results in one keydown event followed by one keyup event. Press any of
the cursor keys results in two keydown events followed by two keyup
events.
A page demonstrating the problem is at
http://megaflexdestiny.net/bits/safarieventprob.html

Has anyone else come accross this bizarre behaviour and have an
explanation or solution for it?

thanks,

mike
Stephen Chalmers - 29 Jul 2005 00:33 GMT
> I'm writing some stuff where I wish to allow the cursor keys to control
> elements in a page. This has not been a problem except with Safari
[quoted text clipped - 12 lines]
>
> mike

The keyboard generates two codes per press for these keys, the first is always 0. For convenience some browsers may
suppress the first code.
I can't test this mod, but unless someone knows a better way, it may be worth a try

function catchkey(e) {

 while(e.keyCode==0)
 ;
 debug(e.type+":"+e.keyCode);
}

--
Stephen Chalmers
547265617375726520627572696564206174204F2E532E207265663A205451323437393134
J.J.SOLARI - 29 Jul 2005 01:07 GMT
> I'm writing some stuff where I wish to allow the cursor keys to control
> elements in a page. This has not been a problem except with Safari
[quoted text clipped - 3 lines]
> the cursor keys results in two keydown events followed by two keyup
> events.

Mike,

This is apparently a Safari bug which you can easily get around.

function go() {
  document.addEventListener("keydown",catchkey,false);
  document.addEventListener("keyup",catchkey,false);
}

W3C DOM supports two propagation schemes: bubbling and capture. Bubbling
means that an event propagates from the element on which it occured down
the document tree to document root (this is called the bubbling phase -
keyword: BUBBLING_PHASE), then from the document root back to the
element (this is called the capture phase - keyword: CAPTURE_PHASE).

When you specify "false" as third argument for the addEventListener
method, it means that event is propagating by bubbling, thus the event
is doing a round robin. As a consequence, you can catch the event a
first time when it is in the BUBBLING_PHASE, and a second time when it
is in the CAPTURE_PHASE.

In your case, you need to catch the event only once, in BUBBLING_PHASE,
and prevent its further propagation by using method stopPropagation like
this:

function catchkey(e) {
  debug(e.type+":"+e.keyCode);

  e.stopPropagation();
  // Note: for IE, you would use this declaration:
  // window.cancelBubble = true;
}

hih,

JJS.

Signature

Anti-spam : <http://public.xdi.org/=jj.solari>

inevercheckthisaddress@hotmail.com - 31 Jul 2005 19:25 GMT
> [snipped]
> In your case, you need to catch the event only once, in BUBBLING_PHASE,
[quoted text clipped - 8 lines]
>    // window.cancelBubble = true;
> }

Well I can't say that I think I understood everything you said but the
stopPropagation method has indeed fixed the problem so thanks for that.
Now I just have to iron out the other Safari only kinks :)

mike.
 
Sign In
Join
My Latest Posts
My Monitored Threads
My Blog
My Photo Gallery
My Profile
My Homepage

Start New Thread
Enable EMail Alerts
Rate this Thread



©2009 Advenet LLC   Privacy Policy - Terms of Use
This website includes both content owned or controlled by Advenet as well as content owned or controlled by third parties.