下面這些簡(jiǎn)單的小技巧能夠幫助你玩轉(zhuǎn)jQuery。

1、返回頂部按鈕

通過(guò)使用jQuery中的animate 和scrollTop 方法，不用插件就可以創(chuàng)建一個(gè)滾動(dòng)到頂部的簡(jiǎn)單動(dòng)畫(huà)：

// Back to top

$('.top').click(function (e) {

e.preventDefault();

$('html, body').animate({scrollTop: 0}, 800);

});

<!-- Create an anchor tag -->

<a class="top" href="#">Back to top</a>

改變scrollTop 的值可以更改你想要放置滾動(dòng)條的位置。所有你真正需要做的是在800毫秒的時(shí)間內(nèi)設(shè)置文檔主體的動(dòng)畫(huà)，直到它滾動(dòng)到文檔的頂部。

注：小心scrollTop的一些錯(cuò)誤行為。

2、預(yù)加載圖像

如果你的網(wǎng)頁(yè)要使用大量開(kāi)始不可見(jiàn)的（例如，懸停的）圖像，那么可以預(yù)加載這些圖像：

$.preloadImages = function () {

for (var i = 0; i < arguments.length; i++) {

$('<img>').attr('src', arguments[i]);

}

};

$.preloadImages('img/hover-on.png', 'img/hover-off.png');