成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

浮動(dòng)【電梯】或【回到底部】的小插件ielevator.js

Tikitoo / 1545人閱讀

摘要：是一個(gè)小插件，使用簡(jiǎn)單，兼容，支持和種配置方式，比錨點(diǎn)更靈活。

iElevator.js是一個(gè)jquery小插件，使用簡(jiǎn)單，兼容IE6，支持UMD和3種配置方式，比錨點(diǎn)更靈活。
Default Options
    _defaults = {
        floors: null,
        btns: null,
        backtop: null,
        selected: "",
        visible: {isHide: "no", numShow: 0},
        speed: 400,
        show: function (me) {
            me.element.show();
        },
        hide: function (me) {
            me.element.hide();
        }
      }

floors:用于獲取頁面中對(duì)于floor模塊的引用

btns: 獲取焦點(diǎn)圖引用

backtop: 獲取回到頂部按鈕的引用

selected: 用于焦點(diǎn)圖在進(jìn)行滾動(dòng)或單擊時(shí)，選中樣式

visible: 用于控制【電梯】是顯示與隱藏，當(dāng)srollTop值大于numShow是就顯示，小于就隱藏

speed: 控制滑條的滾動(dòng)速度

show: 可以重新該函數(shù)，來定制elevator的顯示方式

hide: 可以重新該函數(shù)，來定制elevator的隱藏方式

安裝

npm install ielevator or bower install ielevator

使用 1. back to top 【回到底部】
-------------------------------------------------------------------------------example

HTML:


    TOP

Javascript:

$("#backtop").ielevator({
    backtop: $("#backtop .js-backtop")
});

只需獲取backtop引用即可，就這么簡(jiǎn)單！

2. simulate elelvator
-------------------------------------------------------------------------------example

HTML structure:

Javascript:

    $("#elevator").ielevator({
        floors: $(".js-floor"),
        btns: $("#elevator .js-btn"),
        selected: "selected",
        visible: {isHide: "yes", numShow: 400},
        show: function() {
            $("#elevator").slideDown(400);
        },
        hide: function() {
            $("#elevator").slideUp(400);
        }
    });

注意： data-ielevator-options="{"selected": "custome-selected"} 配置的優(yōu)先級(jí)是最高的

3. simulate elevator + back to top
-------------------------------------------------------------------------------expample

HTML structure:

Javascript:

$("#elevator").ielevator({
    floors: $(".js-floor"),
    btns: $("#elevator .js-btn"),
    backtop: $("#elevator .js-backtop"),
    selected: "selected",
    visible: {isHide: "yes", numShow: 400},
    show: function() {
        $("#elevator").slideDown(400);
    },
    hide: function() {
        $("#elevator").slideUp(400);
    }
});
4. require.js example

這是一個(gè)require.js的實(shí)例

------------------------------------------------------------------------demo_AMD

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/49698.html

相關(guān)文章

  • 浮動(dòng)【電梯】或【回到底部】的小插件ielevator.js

    摘要：是一個(gè)小插件，使用簡(jiǎn)單，兼容，支持和種配置方式，比錨點(diǎn)更靈活。 iElevator.js是一個(gè)jquery小插件，使用簡(jiǎn)單，兼容IE6，支持UMD和3種配置方式，比錨點(diǎn)更靈活。 Default Options _defaults = { floors: null, btns: null, backtop: null, ...

    Cobub 評(píng)論0 收藏0

  • Django搭建個(gè)人博客：回到頂部浮動(dòng)按鈕、矢量圖標(biāo)、頁腳沉底和粘性側(cè)邊欄

    摘要：本章集中介紹四個(gè)重要的小功能回到頂部浮動(dòng)按鈕矢量圖標(biāo)頁腳沉底和粘性側(cè)邊欄。因?yàn)槲覀兿朐谌径紦碛羞@個(gè)按鈕，所以將剛寫好的模塊引用到中在后面引入注意模塊用到了，因此要在后面引入。 本章集中介紹四個(gè)重要的小功能：回到頂部浮動(dòng)按鈕、矢量圖標(biāo)、頁腳沉底和粘性側(cè)邊欄。 這幾個(gè)功能與Django基本沒啥關(guān)系，更多的是前端知識(shí)，但是對(duì)博客網(wǎng)站都很重要，問的讀者也比較多，因此也集中講一下好了。 回到頂...

    lovXin 評(píng)論0 收藏0

  • throttle與debounce的區(qū)別

    摘要：自己嘗試一下年在的文章中第一次看到的實(shí)現(xiàn)方法。這三種實(shí)現(xiàn)方法內(nèi)部不同，但是接口幾乎一致。如你所見，我們使用了參數(shù)，因?yàn)槲覀冎粚?duì)用戶停止改變?yōu)g覽器大小時(shí)最后一次事件感興趣。 前幾天看到一篇文章，我的公眾號(hào)里也分享了《一次發(fā)現(xiàn)underscore源碼bug的經(jīng)歷以及對(duì)學(xué)術(shù)界拿來主義的思考》具體文章詳見，微信公眾號(hào)：showImg(https://segmentfault.com/img/b...

    Pluser 評(píng)論0 收藏0

  • 【譯】通過例子解釋 Debounce 和 Throttle

    摘要：舉例舉例通過拖拽瀏覽器窗口，可以觸發(fā)很多次事件。不支持，所以不能在服務(wù)端用于文件系統(tǒng)事件?？偨Y(jié)將一系列迅速觸發(fā)的事件例如敲擊鍵盤合并成一個(gè)單獨(dú)的事件。確保一個(gè)持續(xù)的操作流以每毫秒執(zhí)行一次的速度執(zhí)行。 Debounce 和 Throttle 是兩個(gè)很相似但是又不同的技術(shù)，都可以控制一個(gè)函數(shù)在一段時(shí)間內(nèi)執(zhí)行的次數(shù)。 當(dāng)我們?cè)诓僮?DOM 事件的時(shí)候，為函數(shù)添加 debounce 或者 th...

    LeoHsiun 評(píng)論0 收藏0

  • [譯]通過實(shí)例講解Debouncing和Throtting(防抖與節(jié)流)

    摘要：譯通過實(shí)例講解和防抖與節(jié)流源碼中推薦的文章，為了學(xué)習(xí)英語，翻譯了一下原文鏈接作者本文來自一位倫敦前端工程師的技術(shù)投稿。首次或立即你可能發(fā)現(xiàn)防抖事件在等待觸發(fā)事件執(zhí)行，直到事件都結(jié)束后它才執(zhí)行。 [譯]通過實(shí)例講解Debouncing和Throtting(防抖與節(jié)流) lodash源碼中推薦的文章，為了學(xué)習(xí)（英語），翻譯了一下~ 原文鏈接 作者：DAVID CORBACHO 本文來自一位...

    Jenny_Tong 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

Tikitoo

男|高級(jí)講師

TA的文章

閱讀更多
最新活動(dòng)
閱讀需要支付1元查看
<