$ npm install polymer-simple-slider
A Polymer element providing a simple slider functionality.
Maintained by Ruy Adorno.
<simple-slider style="width:400px; height:400px">
<img src="http://placekitten.com/g/400/400"/>
<img src="https://unsplash.it/400/400/?random=0"/>
<img src="https://unsplash.it/400/400/?random=1"/>
<img src="https://unsplash.it/400/400/?random=2"/>
</simple-slider>
Install using Bower (also available on npm)
bower install --save polymer-simple-slider
Import Web Components' polyfill:
<script src="bower_components/webcomponents.js/webcomponents.js"></script>
Import Custom Element:
<link rel="import" href="bower_components/polymer-simple-slider/simple-slider.html">
Start using it!
<simple-slider style="width:500px; height:500px">
<img src="foo/bar1.png"/>
<img src="foo/bar2.png"/>
<img src="foo/bar3.png"/>
</simple-slider>
version: 1.1.0
| Attribute | Options | Default | Description |
|---|---|---|---|
no-auto-play | Boolean | false | If this attr is present, do not auto play slides |
transitionProperty | left, right, opacity | left | Determines the css property to be animated |
transitionDuration | Number | 0.5 | Value setting the duration of animation transition |
transitionDelay | Number | 3 | Value determining the wait between each animation when you use autoPlay:true |
startValue | Number | -elem.width | Initial value of slide elements when starting a transition animation |
visibleValue | Number | 0 | The value a slide element should have when it is displayed |
endValue | Number | elem.width | The value a slide will move to during a transition animation |
git checkout -b my-new-featuregit commit -m 'Add some feature'git push origin my-new-featureFor detailed changelog, check Releases.
This project is a simple polymer element implementation of SimpleSlider. Please visit its page for more information.