the script i've pieced together so far looks like this:
<script type="text/javascript">
/* KEYNAV */
document.onkeydown = function(e) {
if (! e) var e = window.event;
var code = e.charCode ? e.charCode : e.keyCode;
if (! e.shiftKey && ! e.ctrlKey && ! e.altKey && ! e.metaKey) {
if (code == Event.KEY_LEFT) {
if ($('previous_page_link')) location.href = $('previous_page_link').href;
} else if (code == Event.KEY_RIGHT) {
if ($('next_page_link')) location.href = $('next_page_link').href;}
}
});
</script>
and my html looks like this:
<p>
{block:PreviousPage}
<a id="previous_page_link" href="{PreviousPage}">PREVIOUS PAGE</a>
{/block:PreviousPage}
{block:NextPage}
<a id="next_page_link" href="{NextPage}">NEXT PAGE</a>
{/block:NextPage}
</p>
the {PreviousPage} / {NextPage} code represents dynamic page links which are different depending on which page you are on. this particular question is specific to tumblr, but generally as well:
is there a way to get my left and right arrow keys to trigger these dynamic links?
thank you for reading and any help with this is greatly appreciated.
function leftArrowPressed() {
// Your stuff here
}
function rightArrowPressed() {
// Your stuff here
}
document.onkeydown = function(evt) {
evt = evt || window.event;
switch (evt.keyCode) {
case 37:
leftArrowPressed();
break;
case 39:
rightArrowPressed();
break;
}
};
Use this to tell you the keyIdentifier attribute of the
<html>
<head>
<script type="text/javascript">
document.onkeydown = function() {
alert (event.keyIdentifier);
};
</script>
</head>
<body>
</body>
</html>
Then you can use if-then logic to ignore all key presses you aren't interested in, and wire the correct behavior to the ones you are.
The following will assign the left and right arrow keys to your links (based on the id of the anchor/link elements).
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
document.onkeydown = function()
{
var j = event.keyIdentifier
if (j == "Right")
window.location = nextUrl
else if (j == "Left")
window.location = prevUrl
}
});
$(document).ready(function() {
var nextPage = $("#next_page_link")
var prevPage = $("#previous_page_link")
nextUrl = nextPage.attr("href")
prevUrl = prevPage.attr("href")
});
</script>
</head>
<body>
<p>
<a id="previous_page_link" href="http://www.google.com">Google</a>
<a id="next_page_link" href="http://www.yahoo.com">Yahoo</a>
</p>
</body>
</html>
