mirror of
https://github.com/element-plus/element-plus.git
synced 2026-03-13 07:51:17 +08:00
* Replace jsx with customized API syntax Co-authored-by: JeremyWuuuuu <15975785+JeremyWuuuuu@users.noreply.github.com>
2.2 KiB
2.2 KiB
title, lang
| title | lang |
|---|---|
| Affix | en-US |
Affix
Fix the element to a specific visible area.
Basic Usage
Affix is fixed at the top of the page by default.
:::demo You can set offset attribute to change the offset top,the default value is 0.
affix/basic
:::
Target Container
You can set target attribute to keep the affix in the container at all times. It will be hidden if out of range.
:::demo Please notice that the container avoid having scrollbar.
affix/target
:::
Fixed Position
The affix component provides two fixed positions: top and bottom.
:::demo You can set position attribute to change the fixed position, the default value is top.
affix/fixed
:::
Affix API
Affix Attributes
| Name | Description | Type | Default | Required |
|---|---|---|---|---|
offset |
offset distance. | ^[number] | 0 |
No |
position |
position of affix. | ^[enum]'top' | 'bottom' |
'top' |
No |
target |
target container. (CSS selector) | ^[string] | — | No |
z-index |
z-index of affix |
^[number] | 100 |
No |
Affix Events
| Name | Description | Type |
|---|---|---|
change |
triggers when fixed state changed. | ^[Function](fixed: boolean) => void |
scroll |
triggers when scrolling. | ^[Function](value: { scrollTop: number, fixed: boolean }) => void |
Affix Exposes
| Method | Description | Type |
|---|---|---|
update |
update affix state manually | ^[Function]() => void |
updateRoot |
update rootRect info | ^[Function]() => void |
Affix Slots
| Name | Description |
|---|---|
default |
customize default content. |