如何使用 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 次浏览

开启你的 职业生涯

完成课程以获得认证

开始