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/webcomponentsjs/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 |
auto-reload |
Boolean | false |
If this attr is present the slider is reset whenever one of its child elements change |
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
For detailed changelog, check Releases.
This project is a simple polymer element implementation of SimpleSlider. Please visit its page for more information.