Fix for issue 144 (#146)

* slide index

add a slide index data attribute to each slide upon initialisation.

line 103,
[].forEach.call(_.slides, function (_) {
      _.classList.add('glider-slide')
})

changed to 

 [].forEach.call(_.slides, function (_,i) {
      _.classList.add('glider-slide');
      _.setAttribute('data-gslide',i)
    })

* slide index

slide index attribute

* scroll left fix

* scroll left replace

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 .config
 .npm
+/*~

glider.js

@@ -56,7 +56,7 @@
     )
 
     // set defaults
-    _.animate_id = _.page = _.slide = 0
+    _.animate_id = _.page = _.slide = _.scrollLeft = 0
     _.arrows = {}
 
     // preserve original options to
@@ -100,6 +100,7 @@
 
     _.slides = _.track.children;
 
+
     [].forEach.call(_.slides, function (_, i) {
       _.classList.add('glider-slide')
       _.setAttribute('data-gslide', i)
@@ -265,14 +266,14 @@
       if (_.arrows.next) {
         _.arrows.next.classList.toggle(
           'disabled',
-          Math.ceil(_.ele.scrollLeft + _.containerWidth) >=
+          Math.ceil(_.scrollLeft + _.containerWidth) >=
             Math.floor(_.trackWidth) || disableArrows
         )
       }
     }
 
-    _.slide = Math.round(_.ele.scrollLeft / _.itemWidth)
-    _.page = Math.round(_.ele.scrollLeft / _.containerWidth)
+    _.slide = Math.round(_.scrollLeft / _.itemWidth)
+    _.page = Math.round(_.scrollLeft / _.containerWidth)
 
     var middle = _.slide + Math.floor(Math.floor(_.opt.slidesToShow) / 2)
 
@@ -283,7 +284,7 @@
 
     // the last page may be less than one half of a normal page width so
     // the page is rounded down. when at the end, force the page to turn
-    if (_.ele.scrollLeft + _.containerWidth >= Math.floor(_.trackWidth)) {
+    if (_.scrollLeft + _.containerWidth >= Math.floor(_.trackWidth)) {
       _.page = _.dots ? _.dots.children.length - 1 : 0
     }
 
@@ -292,9 +293,9 @@
 
       var wasVisible = slideClasses.contains('visible')
 
-      var start = _.ele.scrollLeft
+      var start = _.scrollLeft
 
-      var end = _.ele.scrollLeft + _.containerWidth
+      var end = _.scrollLeft + _.containerWidth
 
       var itemStart = _.itemWidth * index
 
@@ -451,14 +452,13 @@
 
     var animate = function () {
       var now = new Date().getTime() - start
-      _.ele.scrollLeft =
-        _.ele.scrollLeft +
-        (scrollTarget - _.ele.scrollLeft) *
-          _.opt.easing(0, now, 0, 1, scrollDuration)
+      _.scrollLeft = _.scrollLeft + (scrollTarget - _.scrollLeft) * _.opt.easing(0, now, 0, 1, scrollDuration)
+      _.ele.scrollLeft = _.scrollLeft
+
       if (now < scrollDuration && animateIndex === _.animate_id) {
         _window.requestAnimationFrame(animate)
       } else {
-        _.ele.scrollLeft = scrollTarget
+        _.ele.scrollLeft = _.scrollLeft = scrollTarget
         callback && callback.call(_)
       }
     }
@@ -488,9 +488,10 @@
     var _ = this
     if (_.mouseDown) {
       _.isDrag = true
-      _.ele.scrollLeft +=
+       _.scrollLeft +=
         (_.mouseDown - e.clientX) * (_.opt.dragVelocity || 3.3)
       _.mouseDown = e.clientX
+      _.ele.scrollLeft = _.scrollLeft
     }
   }