Grow your CSS skills. Land your dream job.

Multiple keydown events fire while holding down key too long (Please help)

  • # December 27, 2012 at 1:07 am

    Hello Everyone,

    There seems to be a few glitches with some jquery I’m working with. I’ve attempted a fix…having no luck. Hopefully the experts here can provide some assistance. Thank you.

    **Problem**
    Multiple keydown events are fired if a user holds down the key for an extended period of time.

    **Attempted Fix**
    Changed keydown to keyup _Failed to solve issue and affected desired output_

    **Goal**
    Fire keydown event only once if the user holds down the key…preventing continuous scrolling

    **Sample**

    http://jsfiddle.net/9JHS6/1/embedded/result/

    # December 27, 2012 at 3:19 pm

    Something like this should work:
    http://jsfiddle.net/tylerhq/9JHS6/8/

    You’re allowed to use the up/down arrows once by setting a variable to true on keyup. Also, the e.preventDefault() prevents the browser window from scrolling up/down.

    # December 27, 2012 at 7:42 pm

    @tylerhq

    That was exactly what I was after. One minor problem though. So currently I have the above sample I posted working in unison with a similar script, but for mousewheel support as apposed to keyboard. Prior to updating the code with your fix, both scripts functioned together. However, after updating, the keydown script fails to work.

    I started a similar thread regarding an issue with the mouse wheel script. That can be found here:
    http://css-tricks.com/forums/discussion/21419/jquery-animation-flickers-during-scroll-please-help#Item_1

    If you wouldn’t mind having a look at that post, and also suggest a more efficient method to combine both to work, I would be ever so grateful.

    Thank You

    # December 28, 2012 at 11:48 pm

    Anyone with a hint for solving this?

    # December 30, 2012 at 2:44 pm

    [Check this out](http://jsfiddle.net/VvU8d/embedded/result/). I combined both scripts. I think that should work for you.

    # December 30, 2012 at 3:47 pm

    @dustinwoods

    Great! Thank you very much. It seems to work quite well, although I noticed the scroll function randomly comes to a complete stop sometimes…typically on the scroll back towards the top.

    Would you have any idea what could be causing that?

    # December 30, 2012 at 3:53 pm

    I couldn’t simulate the issue you were having. But I have a hunch what was causing it. I updated the code, [try this](http://jsfiddle.net/6TCdY/embedded/result/). Does that fix it?

    # December 31, 2012 at 12:34 am

    @dustinwoods

    Awesome, thanks for your help and patience. What exactly was the problem with it?

    # December 31, 2012 at 8:57 pm

    I actually just put the two scripts together, and had no issues. Haha.

    # January 2, 2013 at 6:41 am

    Ahh…I see

    # January 5, 2013 at 4:26 pm

    @dustinwoods

    sent you a private message the other day…curious if you’ve had the opportunity to take a look

    Cheers

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".