# Affix

The affix component toggles position: fixed on and off, emulating the effect found with position: sticky.


You must provide CSS for the positioning and width of your affixed content.


Do not use affix on an element contained in a relatively positioned element, such as a pulled or pushed column.

# Example

Try to scroll the page down and see what's happening to the alert:

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

# API Reference

# Affix (opens new window)

# Props

Name Type Default Required Description
offset Number 0 Pixels to offset from screen when calculating position of scroll.

# Slots

Name Description
default The affix body.

# Events

Name Description
affix This event fires immediately before the element has been affixed.
affixed This event is fired after the element has been affixed.