https://github.com/dylanfoster/sliders.js
sliders.js is a tiny jQuery slideshow plugin.
https://github.com/dylanfoster/sliders.js
Last synced: 6 months ago
JSON representation
sliders.js is a tiny jQuery slideshow plugin.
- Host: GitHub
- URL: https://github.com/dylanfoster/sliders.js
- Owner: dylanfoster
- License: mit
- Created: 2014-03-23T04:31:34.000Z (over 12 years ago)
- Default Branch: master
- Last Pushed: 2016-09-02T21:39:19.000Z (almost 10 years ago)
- Last Synced: 2023-09-19T22:29:06.516Z (almost 3 years ago)
- Language: JavaScript
- Size: 47.9 KB
- Stars: 3
- Watchers: 3
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: History.md
- License: LICENSE
Awesome Lists containing this project
README
sliders.js
==========
sliders.js is a tiny jQuery slideshow plugin.
##1. Setup
Include the latest jQuery Library as well as sliders.js just before your closing body tag
```html
```
##2. HTML Markup
*note: the .page, .pager and data-target values are important
```html
Your captions
```
##3. CSS
```css
.sliders {
position: relative;
float: left;
width: 100%;
height: 400px;
}
.sliders > figure {
position: absolute;
opacity: 0;
width: 100%;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
}
.sliders > figure img {
width: 100%;
height: 100%;
z-index: 1;
}
```
##4. Usage
Start the show....
```javascript
$(".sliders").sliders();
```
or with options:
```javascript
$('.slideshow').sliders({
"auto" : false, //default false, auto start
"speed" : 500, //speed of the transition (default 500)
"timeout" : 7000, //time between slides (default 7000)
"bullets" : false, //pager bullets (default false)
"animate": false, //animates the slide, use in conjuction with direction
"direction": "left" //direction of the slide animation (must set this when using animate:true)
easing: 'jswing' //option easing functions (ease In only, see http://easings.net/ for your options)
});
```
##5. Demo
For a more in depth view, see the example
http://www.dylan-foster.com/sliders
##Credits
[jQuery](http://api.jquery.com/)
##Contact
Copyright (C) 2014 Dylan foster
[Fostered Development](http://www.dylan-foster.com)
[Github](https://github.com/dylan947/)
[@dylfos](http://twitter.com/dylfos)
[+Fostered Development](https://plus.google.com/b/103850011544407258916/103850011544407258916/about)