Easy Automatic Image Carousel Plugin With jQuery - picSlider

Easy Automatic Image Carousel Plugin With jQuery - picSlider
File Size: 6.17 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

picSlider is a super tiny jQuery carousel plugin which slides or fades automatically through a list of images at a certain speed.

How to use it:

1. Download and put the jQuery picSlider plugin's stylesheet in the head section of the document.

<link href="picSlider/picSlider.css" rel="stylesheet">

2. Create a list of images and wrap them into a container with the CSS class of 'picSlider'.

<div class="picSlider">
  <ul>
    <li><img src="1.jpg"></li>
    <li><img src="2.jpg"></li>
    <li><img src="3.jpg"></li>
  </ul>
</div>

3. Call the function on the top container to create a basic image carousel slider on the webpage.

$('.picSlider').picSlider();

4. Change the animation to initialize the plugin as a cross-fading slideshow.

$('.picSlider').picSlider({animate: 'fade'});

5. Adjust the animation speed and transition delay as per your need.

$('.picSlider').picSlider({
  delay: 2000, 
  speed: 1000,
});

This awesome jQuery plugin is developed by YorkChan94. For more Advanced Usages, please check the demo page or visit the official website.