Éste es un pequeño script que nos permite navegar con el teclado, pulsando las flechas izquierda y derecha a través de las páginas del blog o de los posts en particular. Lo podéis poner tanto en el <head> como encima de </body>
El efecto funcionando lo podéis ver ahora mismo en este blog ;). El código debe de ir entre etiquetas <script> y </script>
<script>/*<![CDATA[*/(function(){
if( document.querySelector )
document.addEventListener ? document.addEventListener('keyup', onKeyUp, false): document.attachEvent('onkeyup', onKeyUp);
function onKeyUp(e){
var prevLink = document.querySelector('[rel="prev"]'),
nextLink = document.querySelector('[rel="next"]');
e = e || window.event;
e.target = e.target || e.srcElement;
e.keyCode = e.keyCode || e.which;
if( e.target.tagName !== "BODY" )
return;
if( e.keyCode === 37 || e.keyCode === 39 ){
if(typeof e.preventDefault === 'function'){
e.preventDefault();
} else {
e.returnValue = false;
}
if( e.keyCode === 37 && prevLink ){
window.location = prevLink.href;
} else if ( e.keyCode === 39 && nextLink ) {
window.location = nextLink.href;
}
}
}
})()/*]]>*/</script>Consideraciones a tener en cuenta
Si usáis mi sistema de paginación, ha sido actualizado para que funcione.
Si usáis el sistema de blogger, funcionará siempre que el <b:includable id='nextprev'> sea así (importante tener rel="next" y rel="prev", no sólo por esto sino por el SEO):
<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' rel="next" expr:href='data:newerPageUrl' expr:id='data:widget.instanceId + "_blog-pager-newer-link"' expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a rel="prev" class='blog-pager-older-link' expr:href='data:olderPageUrl' expr:id='data:widget.instanceId + "_blog-pager-older-link"' expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<a class='home-link' rel="home" expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:if cond='data:mobileLinkUrl'>
<div class='blog-mobile-link'>
<a expr:href='data:mobileLinkUrl'><data:mobileLinkMsg/></a>
</div>
</b:if>
</div>
<div class='clear'/>
</b:includable>