Arc Images

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

Default Options

defaults: {
  loop: false,
  minCloneLoopRounds: 1,
  maxCloneLoopRounds: 1,
  progressEffect: {
    preset: 'arc',
    intensity: 0.4
  }
}

HTML Markup

<div class="js-arc-images"
  data-arts-component-name="ArcImages"
  data-arts-component-options="{}"
  >
  <div class="js-arc-images__list-lane">
    <div class="js-arc-images__list-item">
      ...
    </div>
    <div class="js-arc-images__list-item">
      ...
    </div>
    <div class="js-arc-images__list-item">
      ...
    </div>
  </div>
</div>