Headroom 插件可以在頁面滾動時做出響應(yīng)，例如在頁面向下滾動時，應(yīng)用欄消失；頁面向上滾動時，應(yīng)用欄出現(xiàn)。

前面介紹的在滾動時自動隱藏應(yīng)用欄和自動隱藏底部導(dǎo)航欄的功能就是使用該插件實現(xiàn)的。

調(diào)用方式

• 通過自定義屬性調(diào)用
  
• 通過 JavaScript 調(diào)用
  

調(diào)用方式

通過自定義屬性調(diào)用

使用該方式無需編寫 JavaScript 代碼。只需在元素上添加 mdui-headroom="options" 屬性即可激活該插件。

<div mdui-headroom style="position: fixed; top: 0; left: 0; right: 0;"></div>

在線運行

通過 JavaScript 調(diào)用

實例化插件：

// selector 為 CSS 選擇器或 DOM 元素
// options 為插件的參數(shù)，見下面的參數(shù)列表
var inst = new mdui.Headroom(selector, options);

在線運行

參數(shù)

方法

事件