jQuery - 如何點擊時將錨點滾動到頁面頂部？

Question

我有一個div元素的鏈接列表，我使用dropcontent.js在單擊鏈接時將內容加載到另一個div。現在我想添加一些將點擊鏈接滾動到瀏覽器窗口頂部的代碼。

HTML是這樣的列表中的每個項目：

<div class="work"> 
    <h3><a class="scroll" href="project2.html">Project 2</a></h3> 
    <div class="projectIntro"> 
     <p>This is some intro text for project 2</p> 
    </div> 
    <div class="pictures"></div> 
</div> 

我發現教程點擊一個鏈接時，滾動到一個ID（通過使HREF的div ID要滾動到 - 不幸的是我不能這樣做，因爲我的href實際上是一個單獨的html頁面，即使它正在使用dropcontent將它加載到當前頁面中

我還發現了一個教程，用於在頁面加載時滾動到特定ID ，但沒有一個簡單地說當一個給定類的錨點被點擊時，將它滾動到瀏覽器窗口的頂部。

有人可以幫我解決這個問題嗎？謝謝。

UPDATE：

我有滾動使用下面的代碼工作：

$('.work a').click(function() { 
     $('html,body').animate({scrollTop: $(this).offset().top}, 500); 
     }); 

但是，我dropcontent.js不再工作......我想是因爲我有2個功能存在的上相同的點擊...我想先加載內容，然後滾動。

這裏是我的dropcontent.js

$('.work a').click(function(event) { 
event.preventDefault(); 

var parent = $(this).parents(".work"); 
var content_holder = parent.children(".pictures"); 

if (parent.hasClass("selected_work")) { 
    close_other(); 
    return; 
} 

close_other(); 

parent.addClass("selected_work"); 
content_holder.load(this + " #content .work"); 

$('.selected_work img').attr("src", "images/arrow_close.gif"); 

}); 


function close_other() { 

var selected_work = $('.selected_work'); 

selected_work.children('.pictures').empty();  
$('.selected_work img').attr("src", "images/arrow_open.gif"); 
selected_work.removeClass("selected_work") 
} 

}); 

所以現在我只需要這些代碼2位整合，讓他們一起工作......到目前爲止，還沒有我有沒有運氣這樣做 - 如果我添加滾動（動畫）功能，負載功能停止工作......

更新2

原來這是別的東西這是造成問題的原因 - 我現在有工作！

Answer 1

這裏是你如何滾動鏈接到頂端：

$('.work a').click(function() { 
    $('html,body').animate({scrollTop: $(this).offset().top}, 500); 
}); 

Answer 2

不是您的問題的直接答案，而是您可能想要使用的很好的參考。

http://demos.flesler.com/jquery/scrollTo/

jQuery的scrollTo插件可以讓你滾動到你的頁面中的任何錨<a>。如果您只是在窗口頂部放置錨點，則可以使用scrollTo直接使用動畫進入。

Answer 3

這個回答下面鏈接是密切相關的，良好的信息爲喜歡能夠

• 滾動所有的人的問題該頁面爲某個元素，div id

• 讓該元素通過點擊該元素的 錨點滾動到頁面的頂部

• 讓該元素通過點擊包含所有錨鏈接的 實際div id滾動到頁面的頂部; 「點擊捕手格」

Scroll element to top of page by clicking anchor inside element or anywhere inside containing div id