国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

jQuery 實現(xiàn)支持分級標題標簽的文章目錄

Yujiaao / 1799人閱讀

摘要：背景首個版本修改意見鑒于單個標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦代碼獲取內(nèi)容添加位置存入數(shù)組若存在標簽滑動窗口時從開始獲取當前位置獲取上一個位置以備回滑滑過當前位置調(diào)至下一個位置滑回上一個位置調(diào)至上

背景 首個版本

https://www.ouorz.com/366

修改意見

鑒于單個 H 標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦

代碼 
var count_ti = count_in = count_ar = count_sc = count_hr = count_e = 1;
var offset = new Array;
$(".article-content h3").each(function () { //each獲取h3內(nèi)容
    $("#article-index").html($("#article-index").html() + "
  •   " + $(this).eq(0).html() +
        "
    • ");
    $(this).eq(0).attr("id", "in" + (count_in++)); //h3添加id
    offset[0] = 0;
    offset[count_ar++] = $(this).eq(0).offset().top; //h3位置存入數(shù)組
    count_e++
});

if (count_e !== 1) { //若存在h3標簽

    $(window).scroll(function () { //滑動窗口時
        var scroH = $(this).scrollTop() + 130;
        var navH = offset[count_sc]; //從1開始獲取當前h3位置
        var navH_prev = offset[count_sc - 1]; //獲取上一個h3位置(以備回滑)
        if (scroH >= navH) { //滑過當前h3位置
            $("#ti" + (count_sc - 1)).attr("class", "");
            $("#ti" + count_sc).attr("class", "active");
            count_sc++; //調(diào)至下一個h3位置
        }
        if (scroH <= navH_prev) { //滑回上一個h3位置,調(diào)至上一個h3位置
            $("#ti" + (count_sc - 2)).attr("class", "active");
            count_sc--;
            $("#ti" + count_sc).attr("class", "");
        }
    });

} else {
    $(".index-div").css("display", "none")
}

    ↑ JavaScript 代碼

    批注

    $(“:header”) 可以獲取標題標簽（Hx）

    prop(“tagName”).replace(‘H’, ”) 可以獲取到標簽級別

    文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

    轉(zhuǎn)載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/54909.html

    相關(guān)文章

    • jQuery 實現(xiàn)支持分級標題標簽的文章目錄

      摘要：背景首個版本修改意見鑒于單個標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦代碼獲取內(nèi)容添加位置存入數(shù)組若存在標簽滑動窗口時從開始獲取當前位置獲取上一個位置以備回滑滑過當前位置調(diào)至下一個位置滑回上一個位置調(diào)至上 背景 首個版本 https://www.ouorz.com/366 修改意見 鑒于單個 H 標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦 代碼 ...

      余學文 評論0 收藏0

    • jQuery 實現(xiàn)支持分級標題標簽的文章目錄

      摘要：背景首個版本修改意見鑒于單個標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦代碼獲取內(nèi)容添加位置存入數(shù)組若存在標簽滑動窗口時從開始獲取當前位置獲取上一個位置以備回滑滑過當前位置調(diào)至下一個位置滑回上一個位置調(diào)至上 背景 首個版本 https://www.ouorz.com/366 修改意見 鑒于單個 H 標簽設(shè)置比較麻煩糾結(jié)，而且有主題用戶反饋，索性改成可以分級的啦 代碼 ...

      Lyux 評論0 收藏0

    • 為你的文章生成目錄索引

      摘要：使用可以快速為你的頁面生成目錄的結(jié)構(gòu)，擁有較強的可定制性，并且并不會擅自為你做太多的事情，以便你更容易地把應(yīng)用到你的項目中。 引言 為頁面中的標題元素建立目錄索引，這是一個不起眼卻很實用的功能，特別是對于那些含有篇幅很長的文章的頁面，擁有一個目錄可以讓讀者對文章的結(jié)構(gòu)一目了然，更重要的是，讀者可以很輕松地在文章的各個章節(jié)之間來回快速跳轉(zhuǎn)，極大地提高了用戶體驗。 toc.js 使用 to...

      魏憲會 評論0 收藏0

    發(fā)表評論

    0條評論

    Yujiaao

    男|高級講師

    TA的文章

    閱讀更多
    最新活動
    閱讀需要支付1元查看
    <