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

开启您的 职业生涯

完成课程获得认证

开始