點擊可以平滑定位到網頁指定位置
其實就是比較人性化的錨點效果，點擊能夠以平滑的方式定位到網頁的指定位置。
并不像是默認的錨點功能瞬間到達的效果。
代碼:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("a.topLink").click(function() {
$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});
return false;
});
});
</script>
</head>
<body>
<div id="anchor">實例</div>
<p><a href="#anchor" class="topLink">點擊定位</a></p>
</body>
</html>
上面的代碼實現了平滑定位效果，下面介紹一下它的實現過程。
一.代碼注釋:
（1）.$(document).ready(function(){})，當文檔結構完全加載完畢再去執行函數中的代碼。
（2）.$("a.topLink").click(function() {})，為class屬性值為topLink的鏈接<a>元素注冊click事件處理函數。
（3）.$("html, body").animate({
scrollTop: $($(this).attr("href")).offset().top + "px"
}, {
duration: 500,
easing: "swing"
});
return false;
})，以動畫方式實現了定位效果。
$($(this).attr("href")).offset().top，鏈接的href屬性值就是div元素的id屬性值。
$($(this).attr("href"))獲取div元素。
$($(this).attr("href")).offset().top，獲取div元素距離頂部的距離。
（4）.return false，取消點擊鏈接的跳轉效果。
相關推薦
-
javascript通用獲取元素樣式屬性值代碼實例
本章節分享一段代碼實例，它實現了具有通用效果的獲取元素指定樣式屬性值的功能。無論是使用l.styl.ttr方式定義的屬性還是樣式表定義的屬性，都可以獲取。代碼實例如下: ht
-
js動態設置元素透明度代碼實例
本章節分享一段代碼實例，它實現了動態設置元素透明度效果。當然這個動態設置不是指的以動畫方式設置透明度。以動畫方式設置透明度可以參閱jvscrit實現的以漸變方式設置透明度一章節。代碼實例如下:
-
javascript如何判斷指定類型元素是否具有指定屬性
本章節分享一段代碼實例，它實現了判斷一個指定類型的元素是否具有指定的屬性。代碼實例如下:function lmntSuortsttribut(lmnt, ttribut) {
-
javascript為什么字符串直接量可以使用屬性和方法
在分析標題中的問題之前先來看一段代碼實例:vr str=實例3;consol.log(str.lngth);如果不深究，那么上面的代碼實在是太普通不過了，但是細致看來，可能有不少朋友有
-
JavaScript 獲取form所有表單元素
本章節介紹一下如何獲取一個form表單下所有的表單元素。方式非常的簡單，代碼如下:m
