jquery.dotslide v0.0.1
jQuery DotSlide
DotSlide is a jquery slideshow plugin for photos. It does not require extensive preset DOM structure and exposes a set of API to interact with. It provides event callback handling options and allows you to add custom transition effects in your implementation.
#Features
- Easy to implement with minimal pre-requisite DOM structure
- Many ways to configure
- Fully responsive
- APIs for programmatic interactions
- Event callbacks
- Extensible - add your own effects
- Supports most modern browsers and devices
#Checkout the demo Play around with the options, API and events.
#Basic Installation
Step 1 - Add the scripts and stylesheet
Add jquery and DotSlide scripts in the page. DotSlide has been tested on jquery 2.0.2 and higher.
<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js'></script>
<script type='text/javascript' src='<path_to_js>/jquery.dotslide-0.0.1.min.js'></script>
<link rel='stylesheet' type='text/css' href='<path_to_css>/jquery.dotslide-0.0.1.min.css'>
Step 2 - Setup HTML markup
Add a container for slideshow.
<div class='dotslide-container'></div>
Step 3 - Initialize DotSlide
Since the slide images are passed to the plugin at the time of initilization, DotSlide can be initialized when the document is loaded or after a ajax or websocket response is received.
$('.dotslide-container').dotslide({
slides: [
{url: '<path_to_image>'},
{url: '<path_to_image>'},
{url: '<path_to_image>'}
]
});
#Documentation
Read the full documentation at http://malay.breecz.com/page/5/2/4/jQuery-DotSlide-Plugin.
10 years ago