Flip Through Elements In A 3D Space – Carousel.js

Category: Javascript , Slider | December 13, 2019
Author: benkimo6i
Views Total: 4,763 views
Official Page: Go to website
Last Update: December 13, 2019
License: MIT

Preview:

Flip Through Elements In A 3D Space – Carousel.js

Description:

A vanilla JavaScript carousel plugin to flip through elements in a 3D space just like the Cover Flow.

Features:

  • Navigation controls.
  • Pagination bullets.
  • Transition with a sliding effect.
  • Infinite loop.

How to use it:

1. Load the needed JavaScript and CSS files in the HTML.

<link rel="stylesheet" href="carousel.css" />
<script src="carousel.js"></script>

2. Code the HTML for the carousel & controls.

<div class="gallery">
  <div class="gallery-container">
    <img class="gallery-item" src="1.jpg">
    <img class="gallery-item" src="2.jpg">
    <img class="gallery-item" src="3.jpg">
    <img class="gallery-item" src="4.jpg">
    <img class="gallery-item" src="5.jpg">
  </div>
  <div class="gallery-controls"></div>
</div>

You Might Be Interested In:


Leave a Reply