touch-slider
is a super simple draggable slider for touch devices.
The drag doesn't work with mouse events. IMO for desktop it's better to have some arrow handles instead.
A slide is a container where you can attach content. There is always three slides attached at the same time, so animations can occur.
When a new slide is rendered the new-slide
event is fired.
Use the max attribute to set the max length of slides.
<touch-slider on-new-slide="_onNewSlide" max="[[images.length]]"></touch-slider>
...
_onNewSlide(event) {
var slide = event.detail.slide;
var slideIndex = event.detail.index;
var img = document.createElement('img');
img.setAttribute('src', this.images[slideIndex]);
Polymer.dom(slide).appendChild(img);
}