# Slider Fullpage Backgrounds [Slide]

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

# Default Options

const defaults = {
  webGL: {
    enabled: false,
    watchScroll: 'auto',
    vertices: 16,
    transitionEffect: 3
  },
  textTransitionDirection: 'auto',
  preventScroll: false,
  mouse: true,
  keyboard: true,
  controls: true,
  loop: true,
  autoplay: 6,
  scaleInner: 1.0,
  scaleOuter: 1.0,
  shapeSize: 57.5,
  shapeSizeTransition: 17.5,
  transitionDuration: 1.2,
  direction: 'horizontal',
  itemIdAttribute: 'data-post-id'
};

# HTML Markup

<div
  class="slider-fullpage-backgrounds js-slider-fullpage"
  data-arts-component-name="SliderFullpageBackgroundsSlide"
  data-arts-component-options="{}"
  data-arts-os-animation="true"
>
  ...
</div>