Author: | eshanshah7 |
---|---|
Views Total: | 2,126 views |
Official Page: | Go to website |
Last Update: | February 22, 2017 |
License: | MIT |
Preview:

Description:
A basic vanilla image carousel library that dynamically loads images from an external JSON file and then presents them in a responsive carousel UI.
How to use it:
Load the necessary JavaScript and CSS files in the webpage.
<link rel="stylesheet" href="css/styles.css"> <script src="js/myjs.js"></script>
Create a carousel container together with the navigation & pagination controls as this:
<div id="container" class="slide-container"> <!-- prev/next buttons --> <a class="prev" onclick="plusSlides(-1)">❮</a> <a class="next" onclick="plusSlides(1)">❯</a> </div> <!-- pagination bullets --> <div id="dots"></div>
The JSON structure should be like this.
[{ "title": "title 1" , "image_name": "1.jpg" , "description": "description 1" , "is_published": true }, { "title": "title 2" , "image_name": "2.jpg" , "description": "description 2" , "is_published": true }, { "title": "title 3" , "image_name": "3.jpg" , "description": "description 3" , "is_published": true }]