Fixed Wall

Customization	Reference
HTML selector	🔧 [data-arts-component-name="FixedWall"]
Component source	📄 HTML/js/components/FixedWall.js
Component source (gulp)	📄 SOURCE/components/fixedWall/FixedWall.js

Default Options

defaults: {
  direction: 'vertical',
  duration: '400%',
  scrub: 1,
  matchMedia: '(min-width: 992px)',
  toggleHeaderVisibility: true
}

HTML Markup

<section
  class="section-fullheight js-fixed-wall"
  data-arts-component-name="FixedWall"
  data-arts-component-options="{}"
>
  <div class="js-fixed-wall__fixed-wrapper">
    <div class="js-fixed-wall__list">
      <!-- Lane #1 -->
      <div class="js-fixed-wall__list-lane">
        <div class="js-fixed-wall__list-item">
          ...
        </div>
        <div class="js-fixed-wall__list-item">
          ...
        </div>
        <div class="js-fixed-wall__list-item">
          ...
        </div>
      </div>
      <!-- Lane #2 -->
      <div class="js-fixed-wall__list-lane">
        <div class="js-fixed-wall__list-item">
          ...
        </div>
        <div class="js-fixed-wall__list-item">
          ...
        </div>
        <div class="js-fixed-wall__list-item">
          ...
        </div>
      </div>
    </div>
  </div>
</section>