By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,817 Members | 2,152 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,817 IT Pros & Developers. It's quick & easy.

arrow keys through list of div cursor links

P: n/a
I'm dynamically building a list of divs that a user can click and sets
off an action. I was hoping to build into it a way to use the up and
down arrow keys to navigate the list and the enter key to select the
one that is focused - any idea how I could achieve this?

it's basically this:

<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('1')">item 1</div>
<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('2')">item 2</div>
<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('3')">item 3</div>
Jul 16 '08 #1
Share this Question
Share on Google+
5 Replies


P: n/a
ca********@gmail.com wrote:
I'm dynamically building a list of divs that a user can click and sets
off an action. I was hoping to build into it a way to use the up and
down arrow keys to navigate the list and the enter key to select the
one that is focused - any idea how I could achieve this?
You should use a `select' element, then it becomes much easier.
it's basically this:

<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('1')">item 1</div>
<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('2')">item 2</div>
<div style="cursor:pointer; cursor:hand;" onClick="return
callAction('3')">item 3</div>
Yuck.
PointedEars
--
var bugRiddenCrashPronePieceOfJunk = (
navigator.userAgent.indexOf('MSIE 5') != -1
&& navigator.userAgent.indexOf('Mac') != -1
) // Plone, register_function.js:16
Jul 16 '08 #2

P: n/a
Not one of the arrow keys returns anything
try it...

<body onkeypress='alert(event.keyCode)'></body >
Jul 17 '08 #3

P: n/a
Laser Lips wrote:
Not one of the arrow keys returns anything
try it...

<body onkeypress='alert(event.keyCode)'></body >
To whom and to what are you referring to?
PointedEars
--
Use any version of Microsoft Frontpage to create your site.
(This won't prevent people from viewing your source, but no one
will want to steal it.)
-- from <http://www.vortex-webdesign.com/help/hidesource.htm>
Jul 17 '08 #4

P: n/a
cantrel...@gmail.com wants to basically move up and down through divs
using the arrow key. Moveing through them probably means highlighting
them adn then, as he says, initiaiting an action. But you cant do
that using the arrow key because in JavaScript the arrow keys do not
give of any event.
Jul 18 '08 #5

P: n/a
I stand corrected ...
function handleArrowKeys(evt) {
evt = (evt) ? evt : ((window.event) ? event : null);
if (evt) {

alert(evt.keyCode);
switch (evt.keyCode) {
case 37:

break;
case 38:

break;
case 39:

break;
case 40:

break;
}
}
}

document.onkeyup = handleArrowKeys;
Jul 31 '08 #6

This discussion thread is closed

Replies have been disabled for this discussion.