国产精品成人久久久久,国产小视频在线高清播放,a黄 国产理论自拍_精品国产91久久久久久久a_99热综合_国语自产拍天天在线

0712-2888027 189-8648-0214
微信公眾號(hào)

孝感風(fēng)信網(wǎng)絡(luò)科技有限公司微信公眾號(hào)

當(dāng)前位置:主頁(yè) > 技術(shù)支持 > Javascript/JQuery > JQuery實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置代碼片段

JQuery實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置代碼片段

時(shí)間:2018-07-12來(lái)源:風(fēng)信官網(wǎng) 點(diǎn)擊: 719次
JQuery實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置代碼片段

風(fēng)信建站項(xiàng)目開(kāi)發(fā)過(guò)程中應(yīng)用到使用animate動(dòng)畫函數(shù)實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置,這種效果比起使用scroll到指定地點(diǎn),用戶在體驗(yàn)中會(huì)感覺(jué)更平滑,當(dāng)然兩種方法各有所長(zhǎng),分享項(xiàng)目實(shí)戰(zhàn)片段代碼如下:

HTML代碼:

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-1 navbar-fixed-top">
            <h1 class="logo"><a href="">?快樂(lè)校外</a></h1>
        </div>
        <div class="col-lg-8 col-md-offset-3">
            <ul id="navmenu">
                <li><a href="/" title="首頁(yè)">?首頁(yè)</a></li>
                <li><a href="#teacher" class="topLink" title="?瀏覽教師">?瀏覽教師</a></li>
                <li><a href="/" title="開(kāi)始約課">?開(kāi)始約課</a></li>
                <li><a href="#process" class="topLink" title="上課流程">?上課流程</a></li>
                <li><a href="/" title="最新動(dòng)態(tài)">最新動(dòng)態(tài)</a></li>
            </ul>
        </div>
    </div>
</div>   

JQuery代碼:

$(document).ready(function() {
  $("#navmenu li a.topLink").click(function() {
    $("html, body").animate({
      scrollTop: $($(this).attr("href")).offset().top + "px"
    }, {
      duration: 1000,
      easing: "swing"
    });
    return false;
  });
});

效果截圖如下:
JQuery實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置代碼片段
JQuery實(shí)現(xiàn)<a>標(biāo)簽平滑滾動(dòng)到指定節(jié)點(diǎn)位置代碼片段
欄目列表
推薦內(nèi)容
熱點(diǎn)內(nèi)容
展開(kāi)
沁阳市| 宾阳县| 甘洛县| 长汀县| 平凉市| 大渡口区| 道孚县| 胶州市| 达拉特旗| 喀喇沁旗| 宽甸| 廉江市| 河津市| 青浦区| 盐津县| 榆中县| 翼城县| 星子县| 宝丰县| 噶尔县| 工布江达县| 江门市| 汝阳县| 广德县| 武汉市| 保靖县| 诸暨市| 清水县| 小金县| 女性| 菏泽市| 集安市| 安福县| 丹巴县| 婺源县| 休宁县| 奇台县| 赣榆县| 滕州市| 保定市| 嘉兴市|