Resolved Using $(window).keydown but disabling the key pressed and error

Apothem · 04-09-2009, 05:23 AM

Code:

		$(window).keydown(function(e){
			if( e.keyCode == 9 ) { // 9 = Tab
				$('*').animate({scrollTop: ($(window).scrollTop() + 500)+'px'}, 1000);
				return false;
			}
		});

Every time I press my tab button, it would do the event BUT it would stick to its position and refrain from moving. In other words, I click tab. It would move the page down by 500 pixels. I try to scroll down, but I can't (I'm using FF 3.0.8)

What's wrong?

ALSO when I click the tab button, the tab is still activated even after I returned false. What's wrong with that as well?

Iszak · 04-09-2009, 07:53 AM

I don't know if using the universal selector is appropriate, but I managed to make up an alternative with the following code.

Code:

$('html').keydown(function(event){
  if (event.keyCode === 9)
  {
    $('html').animate({
      scrollTop: $('html').scrollTop() + 500 + 'px'
    });

    return false;
  }
});

Preview: http://pastebin.me/49dd9b1b4aa77

Also, just an idea, maybe make it so key + tab will scroll back to the top or when you're at the bottom and press the tab again, it'll scroll to the top.

Goodluck.

Edit: I've found that it doesn't work for Safari and Google Chrome (webkit) so here's the fix for it.

Code:

$(document).keydown(function(event){
  if (event.keyCode === 9)
  {
    $('html, body').animate({
      scrollTop: $(document).scrollTop() + 500 + 'px'
    });

    return false;
  }
});