Slideshow

Animations

  • Heading

    Lorem ipsum dolor sit amet.

  • Heading

    Lorem ipsum dolor sit amet.

  • Heading

    Lorem ipsum dolor sit amet.

  • Heading

    Lorem ipsum dolor sit amet.

  • Image

    Lorem ipsum dolor sit amet.

  • Video

    Lorem ipsum dolor sit amet.

  • YouTube

    Lorem ipsum dolor sit amet.

  • Vimeo

    Lorem ipsum dolor sit amet.

    Modifing animation with parallax

    • Heading

      Lorem ipsum dolor sit amet.

    • Heading

      Lorem ipsum dolor sit amet.

    • Heading

      Lorem ipsum dolor sit amet.

    • Heading

      Lorem ipsum dolor sit amet.

    Toggle Transitions + Kenburns

    • Bottom

      Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    • Bottom

      Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    • Right

      Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    • Left

      Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    Min/Max Height

      Viewport Height

        JavaScript Options

        Option Value Default Description
        animation String slide The animation to use. (slide, fade, scale, pull, push)
        autoplay Boolean false Starts autoplaying the slideshow.
        autoplay-interval Number 7000 The delay between switching slides in autoplay mode.
        draggable Boolean true Enable pointer dragging.
        finite Boolean false Disable infinite sliding.
        index Number 0 Slideshow item to show. 0 based index.
        pause-on-hover Boolean true Pause autoplay mode on hover.
        velocity Number 1 The animation velocity (pixel/ms).
        ratio Boolean, String 16:9 The ratio. (`false` prevents height adjustment)
        min-height Boolean, Number false The minimum height.
        max-height Boolean, Number false The maximum height.