https://github.com/thecreation/jquery-tinyslider
tinySlider.js is a tiny jQuery plugin that creates a responsive slider with touch support.
https://github.com/thecreation/jquery-tinyslider
Last synced: 10 months ago
JSON representation
tinySlider.js is a tiny jQuery plugin that creates a responsive slider with touch support.
- Host: GitHub
- URL: https://github.com/thecreation/jquery-tinyslider
- Owner: thecreation
- License: gpl-2.0
- Created: 2012-11-27T04:29:23.000Z (over 13 years ago)
- Default Branch: master
- Last Pushed: 2019-10-11T15:23:23.000Z (over 6 years ago)
- Last Synced: 2025-04-05T15:46:06.306Z (about 1 year ago)
- Language: JavaScript
- Size: 1.14 MB
- Stars: 5
- Watchers: 3
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE-GPL
Awesome Lists containing this project
README
# TinySlider
tinySlider is a tiny jQuery plugin that creates a responsive slider with touch support.
## Usage
You can include javascript file and css first:
```html
```
Then init the slider for the structure
```html
-
-
-
jQuery(function($) {
$('.slides').tinySlider();
});
```
### Options
You're also able to use some of the options that let you customize it as you wish:
```javascript
$('element').tinySlider({
namespace: 'tiny', // String: Prefix string attached to the class of every element generated by the plugin
animation: "fade", // String: Select your animation type, "fade" or "slide"
easing: "swing",
duration: 1000, // Integer: Duration of the transition, in milliseconds
delay: 4000, // Integer: Time between slide transitions, in milliseconds
pager: true, // Boolean: Show pager, true or false
nav: true, // Boolean: Show navigation, true or false
prevText: "Previous", // String: Text for the "previous" button
nextText: "Next", // String: Text for the "next" button
random: false, // Boolean: Randomize the order of the slides, true or false
autoplay: true, // Boolean: Animate automatically, true or false
pauseOnHover: true, // Boolean: Pause the slideshow when hovering over slider
useCSS: true, // if use CSS transition, cycle will not works
touch: true,
touchSensitivity: 0.25,
// Callback API
onStart: null, // Callback: function(slider) - Fires when the slider loads the first slide
onBefore: null, // Callback: function(slider) - Fires asynchronously with each slider animation
onAfter: null, // Callback: function(slider) - Fires after each slider animation completes
onEnd: null // Callback: function(slider) - Fires when the slider reaches the last slide (asynchronous)
});
```
## License
Copyright (c) 2015 AmazingSurge
Licensed under the GPL license.