第一種方法
function slow(){
var numOne_top = $(".Expo_box2").offset().top;
$('html,body').animate({
scrollTop:numOne_top
},400)
}
打開頁面，直接調用slow（）定位到某一位置
第二種方法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<style>
body {
text-align: center;
}
#go_to {
position: fixed;
right: 10px;
bottom: 10px;
}
</style>
<body>
<h3 name="top">唐詩300首</h3>
<p>《春曉》<br/>
作者：孟浩然<br/>
春眠不覺曉，處處聞啼鳥。<br/>
夜來風雨聲，花落知多少。</p>
<p> 《鹿柴》<br/>
作者：王維<br/>
空山不見人，但聞人語響。<br/>
返影入深林，復照青苔上。</p>
<p> 《相思》<br/>
作者：王維<br/>
紅豆生南國，春來發(fā)幾枝。<br/>
愿君多采擷，此物最相思。</p>
<p> 《雜詩》<br/>
作者：王維<br/>
君自故鄉(xiāng)來，應知故鄉(xiāng)事。<br/>
來日綺窗前，寒梅著花未。</p>
<p> 《終南望余雪》<br/>
作者：祖詠 <br/>
終南陰嶺秀，積雪浮云端。<br/>
林表明霽色，城中增暮寒。</p>
<p id="jys"> 《靜夜思》<br/>
作者：李白<br/>
床前明月光，疑是地上霜。<br/>
舉頭望明月，低頭思故鄉(xiāng)。</p>
<p> 《登鸛雀樓》<br/>
作者：王之渙<br/>
白日依山盡，黃河入海流。<br/>
欲窮千里目，更上一層樓。</p>
<p> 《江雪》<br/>
作者：柳宗元<br/>
千山鳥飛絕，萬徑人蹤滅。<br/>
孤舟蓑笠翁，獨釣寒江雪。</p>
<p> 《登樂游原》<br/>
作者：李商隱 <br/>
向晚意不適，驅車登古原。<br/>
夕陽無限好，只是近黃昏。</p>
<p> 《彈琴》<br/>
作者：劉長卿 <br/>
泠泠七弦上，靜聽松風寒。<br/>
古調雖自愛，今人多不彈。</p>
<p> 《八陣圖》<br/>
作者：杜甫<br/>
功蓋三分國，名成八陣圖。<br/>
江流石不轉，遣恨失吞吳。</p>
<p id="cao"> 《草》<br/>
作者：白居易<br/>
離離原上草，一歲一枯榮。<br/>
野火燒不盡，春風吹又生。<br/>
遠芳侵古道，晴翠接荒城。 <br/>
又送王孫去，萋萋滿別情。</p>
<p> 《關山月》<br/>
作者：李白<br/>
明月出天山，蒼茫云海間。<br/>
長風幾萬里，吹度玉門關。<br/>
漢下白登道，胡窺青海灣。<br/>
由來征戰(zhàn)地，不見有人還。<br/>
戍客望邊色，思歸多苦顏。<br/>
高樓當此夜，嘆息未應閑。</p>
<p> 《望月懷遠》<br/>
作者：張九齡<br/>
海上生明月，天涯共此時。<br/>
情人怨遙夜，竟夕起相思。<br/>
滅燭憐光滿，披衣覺露滋。<br/>
不堪盈手贈，還寢夢佳期。</p>
<p> 《送杜少府之任蜀州》<br/>
作者：王勃<br/>
城闕輔三秦，風煙望五津。<br/>
與君離別意，同是宦游人。<br/>
海內存知己，天涯若比鄰。<br/>
無為在岐路，兒女共沾巾。</p>
<p> 《春望》<br/>
作者：杜 甫<br/>
國破山河在，城春草木深。<br/>
感時花濺淚，恨別鳥驚心。<br/>
烽火連三月，家書抵萬金。<br/>
白頭搔更短，渾欲不勝簪。</p>
<div id="go_to">
<a href="#top">A、頂部</a>
<button onclick="goToTop();">B、頂部</button>
<button onclick="goToJys();">C、靜夜思</button>
<button onclick="goToCao();">D、草</button>
</div>
</body>
<script type="text/javascript" src="jquery-3.0.0.min.js"></script>
<script type="text/javascript">
function goToTop() {
location.href = "#top";
}
function goToJys() {
$("html,body").animate({scrollTop: $("#jys").offset().top}, 500);//定位到《靜夜思》
}
function goToCao() {
/**
* 如果滾動頁面也是DOM沒有解決的一個問題。為了解決這個問題，瀏覽器實現(xiàn)了一下方法，
* 以方便開發(fā)人員如何更好的控制頁面的滾動。在各種專有方法中，HTML5選擇了scrollIntoView()
* 作為標準方法。
* scrollIntoView()可以在所有的HTML元素上調用，通過滾動瀏覽器窗口或某個容器元素，
* 調用元素就可以出現(xiàn)在視窗中。如果給該方法傳入true作為參數，或者不傳入任何參數，那么
* 窗口滾動之后會讓調動元素頂部和視窗頂部盡可能齊平。如果傳入false作為參數，調用元素
* 會盡可能全部出現(xiàn)在視口中（可能的話，調用元素的底部會與視口的頂部齊平。）不過頂部
* 不一定齊平，例如：
* //讓元素可見
* document.forms[0].scrollIntoView();
* 當頁面發(fā)生變化時，一般會用這個方法來吸引用戶注意力。實際上，為某個元素設置焦點也
* 會導致瀏覽器滾動顯示獲得焦點的元素。
* 支持該方法的瀏覽器有 IE、Firefox、chrome、Safari和Opera。
*
* 注意這里要使用querySelector選擇器
* querySelectorAll 在文檔內找第一個符合選擇器描述的節(jié)點包括Element本身
* jQuery(element) 在文檔內找第一個符合選擇器描述的節(jié)點不包括Element本身
*
* 參考：http://www.cnblogs.com/daxian2012/archive/2012/10/18/2729359.html
* 參考：http://blog.csdn.net/only_love_strangers/article/details/47264889
*/
document.querySelector("#cao").scrollIntoView();
或者
/**
* 這里需要注意的是這里的寫法是：$("#cao")[0]，而不是：$("#cao")，
* 因為$('#cao')取得的是一個jQuery對象，而scrollIntoView()是一個DOM
* 屬性，所以要把jQuery對象轉為DOM對象才行，而數組下標可以將jQuery對象
* 轉成對象DOM對象。
*/
$("#cao")[0].scrollIntoView();
}
</script>
</html>
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
下載 
喜歡 
頂
難過
囧
圍觀
無聊
王者榮耀賬號惡
MARVEL Strike 
2017年10月手游
比官居一品好玩
