# Affix 悬浮

悬浮组件通过切换 position: fixed 开关,来模拟 position: sticky 的效果。

提示

你必须为悬浮内容提供 CSS 以定义位置与宽高

注意

不要在相对定位的容器内使用悬浮组件,比如 pulled 或 pushed column。

# 样例

尝试滚动本页面并观察警告框的变化:

<template>
  <div class="uiv" id="affix-example">
    <affix :offset="50">
      <alert>I'm using affix.</alert>
    </affix>
  </div>
</template>
<style>
  #affix-example .affix {
    z-index: 999;
  }
</style>

# API 文档

# Affix (opens new window)

# 参数

名字 类型 默认值 必填 描述
offset Number 0 当计算滚动悬浮位置时,相对屏幕的偏移像素值

# Slots

名字 描述
default 悬浮体

# Events

名字 描述
affix 该事件在元素被悬浮前触发
affixed 该事件在元素被悬浮后触发