ZoomSlider creates slideshows with zoom effect using background-image and CSS3.
Dependencies:
- jQuery: 1.10.2+
- Modernizr: 2.6.2+ (for css3 transform support detection. May impliment custom script to remove this depencency in future)
To initialise zoomslider, add the attribute data-zs-src to a DOM element and the slider would auto-initialize.
<div data-zs-src='["img1.jpg", "img2.jpg", "img3.jpg"]'>
<p>Sample inner content</p>
</div>
All configurable properties:
| Data attribute | Default value | Possible values |
|---|---|---|
| data-zs-src | null | [] |
| data-zs-speed | 8000 | Number (milliseconds) |
| data-zs-switchSpeed | 800 | Number (milliseconds) |
| data-zs-interval | 4500 | Number (milliseconds) |
| data-zs-autoplay | true | true / false |
| data-zs-bullets | true | true / false |
| data-zs-overlay | 'plain' | false, 'plain', 'dots' |