zblog用键盘上的左右箭头(←和→)实现快速翻页

zblog用键盘上的左右箭头(←和→)实现快速翻页这个功能是用js实现的，加上这个好听点说就是优化了用户体验。实现起来也非常简单，有动手能力的朋友可以尝试下。

zblog现在分为zblogasp和zblogphp两个版本，js代码都是一样的，html代码略有不同。

zblogphp版，将以下代码和最下面的js代码添加到post-single.php合适的位置：

<p>{if $article.Prev}
<a  href="{$article.Prev.Url}" title="{$article.Prev.Title}" class="up" id="up" >上一篇</a>
{/if}</p>
<p>{if $article.Next}
<a  href="{$article.Next.Url}" title="{$article.Next.Title}" class="next" id="next">下一篇</a>
{/if}</p>
<p>试试用"←"或"→"方向键快速翻页把 \(^o^)/</p>

zblogasp版，在模板文件夹里面新建两个文件，分别是“b_article_navbar_l.html”和“b_article_navbar_r.html“，如果模板内已有这两个文件的仅需需求代码和下面的代码保持一致即可。

b_article_navbar_r.html：

<p>下一篇：<a  href="<#article/nav_r/url#>" title="<#article/nav_r/name#>" class="up" id="up"><#article/nav_r/name#></a></p>

b_article_navbar_l.html：

<p>下一篇：<a  href="<#article/nav_l/url#>" title="<#article/nav_l/name#>" class="up" id="up"><#article/nav_l/name#></a></p>

然后在b_article-single.html合适的位置添加以下代码和js代码即可。

<#template:article_navbar_l#> <#template:article_navbar_r#>

最后上js代码，zblogasp版和zblogphp版的js代码都是一样的。

<script language="javascript">
last=document . getElementById("up").href;
next=document.getElementById("next").href;
function keyUp(e) {
    if(navigator.appName == "Microsoft Internet Explorer"){
        var keycode = event.keyCode;var realkey = String.fromCharCode(event.keyCode);
    }else{
        var keycode = e.which;var realkey = String.fromCharCode(e.which);
    }
    if(keycode==39){window.location.href=next;}
    if(keycode==37){window.location.href=last;}
}
document.onkeyup = keyUp;
</script>

最后的最后，按照自己的需求美化下css就是大功告成了，上个演示截图：