arrow keys through list of div cursor links

Discussion in 'Javascript' started by cantrell78@gmail.com, Jul 16, 2008.

  1. Guest

    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, 2008
    #1
    1. Advertising

  2. 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
    Thomas 'PointedEars' Lahn, Jul 16, 2008
    #2
    1. Advertising

  3. Laser Lips Guest

    Not one of the arrow keys returns anything


    try it...

    <body onkeypress='alert(event.keyCode)'></body >
    Laser Lips, Jul 17, 2008
    #3
  4. 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>
    Thomas 'PointedEars' Lahn, Jul 17, 2008
    #4
  5. Laser Lips Guest

    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.
    Laser Lips, Jul 18, 2008
    #5
  6. Laser Lips Guest

    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;
    Laser Lips, Jul 31, 2008
    #6
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Venkat
    Replies:
    8
    Views:
    21,958
    Rob McAninch
    Apr 2, 2004
  2. dmaziuk
    Replies:
    3
    Views:
    556
    Chris Gonnerman
    Jan 25, 2011
  3. Zarkas

    list of links between <div></div>

    Zarkas, Jan 10, 2004, in forum: Javascript
    Replies:
    2
    Views:
    93
    Zarkas
    Jan 10, 2004
  4. Replies:
    1
    Views:
    134
    Joe Smith
    Jan 8, 2005
  5. PJ6
    Replies:
    2
    Views:
    102
Loading...

Share This Page