如何使用 Bootstrap Affix 外掛

affix 外掛允許 <div> 貼上在頁面的某一位置。你還可以使用此外掛切換其固定開關。

affix 外掛在三個類之間切換，每個類都表示一種特定狀態 − .affix、.affix-top 和 .affix-bottom. 按照以下步驟為任一上述用法選項設定 CSS。

• 首先，該外掛會新增 .affix-top 以指示該元素位於其最頂端位置。此時，不需要任何 CSS 定位。
• 滾動到你想固定的元素後應該觸發實際的固定。這是 .affix 替換 .affix-top 並設定 position: fixed;（由 Bootstrap 程式碼 CSS 提供）的位置。
• 如果定義了底偏移量，滾動到該偏移量後應該用 .affix-bottom 替換 .affix。由於偏移量是可選的，因此在設定一個偏移量時要求你設定適當的 CSS。在這種情況下，需要時新增 position: absolute;。

Nancy Den

更新於: 2020 年 6 月 12 日

214 次瀏覽

開啟你的 職業生涯

完成課程以獲得認證

開始