WordPress 技巧：雙擊空白部分返回頂部

因?yàn)楝F(xiàn)在使用的iArtWork主題有一個(gè)雙擊網(wǎng)頁(yè)空白部分返回頂部的功能，所以已經(jīng)習(xí)慣在看完文章之后雙擊一下博客的空白部分，于是乎我就養(yǎng)成了在任何博客都雙擊空白部分的習(xí)慣。

實(shí)際上實(shí)現(xiàn)“WordPres主題雙擊空白部分返回頂部”的方法很是簡(jiǎn)單，

只需要把下面JS代碼加到主題的頭部模版中：

<script type="text/javascript">
$(function(){
    var scrollTo = function(top, duration, callback) {
        var w = $(window);
        var FPS = 50;
        var currentTop = w.scrollTop();
        var offset = (currentTop - top) / (duration * FPS / 1000);
        var n = 0;
        var prevTop = currentTop;
        var t = setInterval(function() {
            if ((prevTop - top) * (currentTop - top) <= 0) {
                clearInterval(t);
                currentTop = prevTop = top;
                w.scrollTop(top);
                if (callback) callback();
            } else {
                prevTop = currentTop;
                w.scrollTop(currentTop -= offset);
            }
        }, 1000 / FPS);
    }
    $('body').dblclick(function(){
        scrollTo(0, 200, function(){
        });
        $(".textField,#commentForm textarea").focus();
    });
    $('#container.#footer').dblclick(function(e){e.stopPropagation();});
});
</script>

OK，修改完的主題即可通過(guò)雙擊主題的空白部分（邊緣四周什么的）實(shí)現(xiàn)返回頂部效果（這個(gè)是我博客的效果，屬于快速分會(huì)），具體效果可以在這里博客進(jìn)行預(yù)覽！

下面更新一個(gè)緩慢返回頂部的方法：

<script type="text/javascript">// < ![CDATA[
var currentpos,timer;
function initialize()
{
timer=setInterval("scrollwindow()",10);
}
function sc(){
clearInterval(timer);
}
function scrollwindow()
{
window.scrollBy(0,1);
}
document.onmousedown=sc
document.ondblclick=initialize
// ]]></script>

使用方法和上面的一樣，直接放到header.php文件的 </head>之前就可以了。

OK，教程到這里就寫(xiě)完了，如果你有什么不懂的地方，歡迎在下方留言，我會(huì)為你解答的。

服務(wù)器租用/服務(wù)器托管中國(guó)五強(qiáng)！虛擬主機(jī)域名注冊(cè)頂級(jí)提供商！15年品質(zhì)保障！--億恩科技[ENKJ.COM]