Sticky utility is used to make the component stick to the top of the window when scrolling. For now, only Masthead and Sectiona can use this utility.

To make the masthead/section sticky on scroll, add data-spy="scroll" data-scroll="sticky" . Add data-is-sticky-hide="auto" to make the masthead hidden -- if the masthead stickied and then user scroll the page down.

<div class="masthead" data-spy="scroll" data-scroll="sticky" data-is-sticky-hide="auto">
    
  ...

</div>

Options

• .is-sticky-shadow-none class for remove shadow of components within masthead/section that has one of these class: .shadow-sm, .shadow, or .shadow-lg.

• .if-is-sticky-border-opacity-1 class specifically to make masthead/section border color opacity = 1 if stickied.

• .if-is-sticky-bg-opacity-1 class specifically to make masthead/section background color opacity = 1 if stickied.

• .if-not-sticky--hidden. Default visibility of Masthead / section with this class is hidden. but became visible after stickied.