(+84) 463.28.7979

“Looped Carousel”


Looped Carousel is a jQuery carousel plugin that provides a simple image gallery functionality.

JavaScript

First we need to include the jQuery framework and the loopedcarousel.js file:
1

The section of the index-#.html file contains these lines of code that initialize the script functionality with basic values:
2
The script initializes an element with the id loopedCarousel, which can have some additional settings:

container: ‘.container’ – class/id for the carousel block
slides: ‘.slides’ – class/id for slides block
pagination: ‘.pagination’ – class/id for pagination block
autoStart: 0 – if set to 1 – auto start
slidespeed: 300 – delay between slides animation in milliseconds
fadespeed: 300 – fade animation speed
items: 3 – number of items to be displayed
padding: 10 – distance between elements
showPagination: true – show pagination
vertical: false/true – for vertical animation

HTML

Below you can see general HTML script representation:
3

CSS

You can find script related stylesheet in the main style.css file.
4

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>