How To Permanently Link Arrow Keys to a ScrollBar using JQuery

Here is a little snippet of JQuery code to link your Up and Down arrow Keys to a specific scroll bar to make it work even if the element it is attached to is not in focus.

	$(document).keydown(function (event) {
	//UP
	if (event.which == 38) {
	event.preventDefault();
	$("#bodyBox").animate({ scrollTop: $("#bodyBox").scrollTop() - 100 }, 'fast');
	}
	//DOWN
	if (event.which == 40) {
	event.preventDefault();
	$("#bodyBox").animate({ scrollTop: $("#bodyBox").scrollTop() + 100 }, 'fast');
	}
	});

view raw gistfile1.js hosted with ❤ by GitHub

This uses the JQuery animate() function attached to the element that contains the scroll bar.
You then provide to the scrollTop porpery the current position of the scroll bar plus or minus a value you want to move it by.