返回頂部用錨點好還是jquery好

各有優(yōu)缺點，錨點的話簡單、直觀、兼容性最佳，不用擔(dān)心客戶端JS未加載成功的情況，但效果比較生硬；jquery在實現(xiàn)效果上更炫一點，能實現(xiàn)滾動到頂部的過渡動畫，但當(dāng)js功能失效時，就完全無法實現(xiàn)返回頂部的功能了?？梢园褍烧呓Y(jié)合起來，在頁面頂部設(shè)一個錨點（例如：header id="top"），返回頂部的按鈕的href屬性設(shè)置為“top”（錨點的id），并加上onclick事件：

創(chuàng)新互聯(lián)主要從事網(wǎng)站設(shè)計、成都做網(wǎng)站、網(wǎng)頁設(shè)計、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)丹陽,十年網(wǎng)站建設(shè)經(jīng)驗,價格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):18980820575

$('#backTop').click(function(e)?{

e.preventDefault();??//?取消事件的默認動作

$('body').animate({scrollTop:0},?400);

});

這樣的話當(dāng)這段js失效時（例如由于網(wǎng)絡(luò)原因未加載成功），返回頂部功能也不會失效。

jquery通過load獲取文件的內(nèi)容并跳到錨點的方法

本文實例講述了jquery通過load獲取文件的內(nèi)容并跳到錨點的方法。分享給大家供大家參考。具體分析如下：

昨天在做一個類似于幫助文檔型的頁面，左邊是導(dǎo)航，右邊顯示的是內(nèi)容。本來打算右邊內(nèi)容顯示區(qū)域用iframe來實現(xiàn)，但由于要做iframe的適應(yīng)高度所以就換了一種方法，使用jquery的ajax中的load方法。

獲取遠程文件中的內(nèi)容很容易實現(xiàn)，直接使用jquery的load方法：

$("#content").load("xxx.aspx")

這樣很容易將xxx.aspx文件中的內(nèi)容放在id為content的標簽中?，F(xiàn)在還要實現(xiàn)的一個效果是：當(dāng)我獲取文件的內(nèi)容后，要跳到相應(yīng)的錨點，于是就想到使用jquery的scrollTop，例如我獲取文件內(nèi)容后，要調(diào)到id="name"的標簽：

$("body,html").animate({scrollTop:$("#name").offset().top});

offset()就是獲取匹配元素在當(dāng)前視口的相對偏移，$("#name").offset().top就是獲取ID為name的標簽在當(dāng)前視口距頂部的相對偏移。以上代碼綜合在一塊需這樣寫：

$(function(){

$("#content").load("xxx.aspx",function(){

$("body,html").animate({scrollTop:$("#name").offset().top});

});

})

為了避免點擊導(dǎo)航不斷的對服務(wù)器發(fā)送請求，我們可以將每次獲取到的數(shù)據(jù)存儲起來。

當(dāng)然，這個方法只適合不考慮SEO優(yōu)化的頁面使用。

希望本文所述對大家的jQuery程序設(shè)計有所幫助。

jquery滾動錨點 需要引用哪些js

1、可以不用引用外部的js，jQuery就能實現(xiàn)；

2、定義好指定的anchor錨點，調(diào)用下面的js代碼可以讓頁面平滑的滾動到指定的位置，非常實用，比如返回頁面頂部，去往頁面底部等功能：

// HTML:

// h1 id="anchor"Lorem Ipsum/h1

// pa href="#anchor" class="topLink"Back to Top/a/p

$(document).ready(function() {

$("a.topLink").click(function() {

$("html, body").animate({

scrollTop: $($(this).attr("href")).offset().top + "px"

}, {

duration: 500,

easing: "swing"

});

return false;

});

});