slick_rails 1.3.3.1 → 1.3.4

data/app/assets/javascripts/slick.js

@@ -16,7 +16,7 @@
 
 /* global window, document, define, jQuery, setInterval, clearInterval */
 
-(function (factory) {
+(function(factory) {
     'use strict';
     if (typeof define === 'function' && define.amd) {
         define(['jquery'], factory);
@@ -24,16 +24,18 @@
         factory(jQuery);
     }
 
-}(function ($) {
+}(function($) {
     'use strict';
     var Slick = window.Slick || {};
 
-    Slick = (function () {
+    Slick = (function() {
+
         var instanceUid = 0;
 
         function Slick(element, settings) {
 
-            var _ = this, responsiveSettings, breakpoint;
+            var _ = this,
+                responsiveSettings, breakpoint;
 
             _.defaults = {
                 accessibility: true,
@@ -41,8 +43,11 @@
                 autoplay: false,
                 autoplaySpeed: 3000,
                 centerMode: false,
-                centerPadding: 50,
+                centerPadding: '50px',
                 cssEase: 'ease',
+                customPaging: function(slider, i) {
+                    return '<button type="button">' + (i + 1) + '</button>';
+                },
                 dots: false,
                 draggable: true,
                 easing: 'linear',
@@ -51,10 +56,9 @@
                 lazyLoad: 'ondemand',
                 onBeforeChange: null,
                 onAfterChange: null,
-                onInit : null,
-                onReInit : null,
+                onInit: null,
+                onReInit: null,
                 pauseOnHover: true,
-                placeholders: true,
                 responsive: null,
                 slide: 'div',
                 slidesToShow: 1,
@@ -67,28 +71,27 @@
             };
 
             _.initials = {
-                animating : false,
-                autoPlayTimer : null,
-                currentSlide : 0,
-                currentLeft : null,
-                direction : 1,
-                dots : null,
-                listWidth : null,
-                listHeight : null,
-                loadIndex : 0,
-                nextArrow : null,
-                prevArrow : null,
-                slideCount : null,
-                slideWidth : null,
-                slideTrack : null,
-                slides : null,
-                sliding : false,
-                slideOffset : 0,
-                placeholderOffset : 0,
-                swipeLeft : null,
-                list : null,
-                touchObject : {},
-                transformsEnabled : false
+                animating: false,
+                autoPlayTimer: null,
+                currentSlide: 0,
+                currentLeft: null,
+                direction: 1,
+                $dots: null,
+                listWidth: null,
+                listHeight: null,
+                loadIndex: 0,
+                $nextArrow: null,
+                $prevArrow: null,
+                slideCount: null,
+                slideWidth: null,
+                $slideTrack: null,
+                $slides: null,
+                sliding: false,
+                slideOffset: 0,
+                swipeLeft: null,
+                $list: null,
+                touchObject: {},
+                transformsEnabled: false
             };
 
             $.extend(_, _.initials);
@@ -98,19 +101,20 @@
             _.animProp = null;
             _.breakpoints = [];
             _.breakpointSettings = [];
+            _.cssTransitions = false;
             _.paused = false;
             _.positionProp = null;
-            _.slider = $(element);
-            _.slidesCache = null;
-            _.cssTransitions = false;
+            _.$slider = $(element);
+            _.$slidesCache = null;
+            _.transformType = null;
+            _.transitionType = null;
             _.windowWidth = 0;
             _.windowTimer = null;
 
             _.options = $.extend({}, _.defaults, settings);
 
             _.originalSettings = _.options;
-            responsiveSettings = _.options.responsive ||
-                null;
+            responsiveSettings = _.options.responsive || null;
 
             if (responsiveSettings && responsiveSettings.length > -1) {
                 for (breakpoint in responsiveSettings) {
@@ -122,29 +126,22 @@
                             responsiveSettings[breakpoint].settings;
                     }
                 }
-                _.breakpoints.sort(function (a, b) {
+                _.breakpoints.sort(function(a, b) {
                     return b - a;
                 });
             }
 
-            _.autoPlay = $.proxy(_.autoPlay,
-                _);
-            _.autoPlayClear = $.proxy(_.autoPlayClear,
-                _);
-            _.changeSlide = $.proxy(_.changeSlide,
-                _);
-            _.setPosition = $.proxy(_.setPosition,
-                _);
-            _.swipeHandler = $.proxy(_.swipeHandler,
-                _);
-            _.dragHandler = $.proxy(_.dragHandler,
-                _);
-            _.keyHandler = $.proxy(_.keyHandler,
-                _);
-            _.autoPlayIterator = $.proxy(_.autoPlayIterator,
-                _);
+            _.autoPlay = $.proxy(_.autoPlay, _);
+            _.autoPlayClear = $.proxy(_.autoPlayClear, _);
+            _.changeSlide = $.proxy(_.changeSlide, _);
+            _.setPosition = $.proxy(_.setPosition, _);
+            _.swipeHandler = $.proxy(_.swipeHandler, _);
+            _.dragHandler = $.proxy(_.dragHandler, _);
+            _.keyHandler = $.proxy(_.keyHandler, _);
+            _.autoPlayIterator = $.proxy(_.autoPlayIterator, _);
 
             _.instanceUid = instanceUid++;
+
             _.init();
 
         }
@@ -153,68 +150,64 @@
 
     }());
 
-    Slick.prototype.addSlide = function (markup, index, addBefore) {
+    Slick.prototype.addSlide = function(markup, index, addBefore) {
 
-        var _ = this,
-            slideTrackChildren;
+        var _ = this;
 
-        if (typeof(index) === "boolean") {
+        if (typeof(index) === 'boolean') {
             addBefore = index;
             index = null;
+        } else if (index < 0 || (index >= _.slideCount)) {
+            return false;
         }
 
         _.unload();
 
-        slideTrackChildren = _.slideTrack.children(this.options.slide);
-
-        if (typeof(index) === "number") {
-            if (index === 0 && $(slideTrackChildren).length === 0) {
-                $(markup).appendTo(_.slideTrack);
-            } else if (index < 0 || (index >= $(slideTrackChildren).length && $(slideTrackChildren).length !== 0) ) {
-                _.reinit();
-                return false;
+        if (typeof(index) === 'number') {
+            if (index === 0 && _.$slides.length === 0) {
+                $(markup).appendTo(_.$slideTrack);
             } else if (addBefore) {
-                $(markup).insertBefore($(slideTrackChildren.get(index)));
+                $(markup).insertBefore(_.$slides.eq(index));
             } else {
-                $(markup).insertAfter($(slideTrackChildren.get(index)));
+                $(markup).insertAfter(_.$slides.eq(index));
             }
         } else {
             if (addBefore === true) {
-                $(markup).prependTo(_.slideTrack);
+                $(markup).prependTo(_.$slideTrack);
             } else {
-                $(markup).appendTo(_.slideTrack);
+                $(markup).appendTo(_.$slideTrack);
             }
         }
 
-        _.slides = _.slideTrack.children(this.options.slide);
+        _.$slides = _.$slideTrack.children(this.options.slide);
 
-        _.slideTrack.children(this.options.slide).remove();
+        _.$slideTrack.children(this.options.slide).remove();
 
-        _.slideTrack.append(_.slides);
+        _.$slideTrack.append(_.$slides);
 
         _.reinit();
 
     };
 
-    Slick.prototype.animateSlide = function (targetLeft,
+    Slick.prototype.animateSlide = function(targetLeft,
         callback) {
 
         var animProps = {}, _ = this;
 
         if (_.transformsEnabled === false) {
             if (_.options.vertical === false) {
-                _.slideTrack.animate({
+                _.$slideTrack.animate({
                     left: targetLeft
-                }, _.options.speed,_.options.easing, callback);
+                }, _.options.speed, _.options.easing, callback);
             } else {
-                _.slideTrack.animate({
+                _.$slideTrack.animate({
                     top: targetLeft
-                }, _.options.speed,_.options.easing, callback);
+                }, _.options.speed, _.options.easing, callback);
             }
 
         } else {
 
-            if(_.cssTransitions === false) {
+            if (_.cssTransitions === false) {
 
                 $({
                     animStart: _.currentLeft
@@ -223,18 +216,18 @@
                 }, {
                     duration: _.options.speed,
                     easing: _.options.easing,
-                    step: function (now) {
+                    step: function(now) {
                         if (_.options.vertical === false) {
-                            animProps[_.animType] = "translate(" +
-                                now + "px, 0px)";
-                            _.slideTrack.css(animProps);
+                            animProps[_.animType] = 'translate(' +
+                                now + 'px, 0px)';
+                            _.$slideTrack.css(animProps);
                         } else {
-                            animProps[_.animType] = "translate(0px," +
-                                now + "px,0px)";
-                            _.slideTrack.css(animProps);
+                            animProps[_.animType] = 'translate(0px,' +
+                                now + 'px,0px)';
+                            _.$slideTrack.css(animProps);
                         }
                     },
-                    complete: function () {
+                    complete: function() {
                         if (callback) {
                             callback.call();
                         }
@@ -246,18 +239,18 @@
                 _.applyTransition();
 
                 if (_.options.vertical === false) {
-                    animProps[_.animType] = "translate3d(" + targetLeft + "px, 0px, 0px)";
+                    animProps[_.animType] = 'translate3d(' + targetLeft + 'px, 0px, 0px)';
                 } else {
-                    animProps[_.animType] = "translate3d(0px," + targetLeft + "px, 0px)";
+                    animProps[_.animType] = 'translate3d(0px,' + targetLeft + 'px, 0px)';
                 }
-                _.slideTrack.css(animProps);
+                _.$slideTrack.css(animProps);
 
-                if(callback) {
-                    setTimeout(function(){
+                if (callback) {
+                    setTimeout(function() {
 
-                    _.disableTransition();
+                        _.disableTransition();
 
-                    callback.call();
+                        callback.call();
                     }, _.options.speed);
                 }
 
@@ -267,31 +260,26 @@
 
     };
 
-    Slick.prototype.applyTransition = function (slide) {
+    Slick.prototype.applyTransition = function(slide) {
 
-        var _ = this, transition,origin;
+        var _ = this,
+            transition = {};
 
-        transition = 'all ' + _.options.speed + 'ms ' + _.options.cssEase;
-        if (_.options.vertical === false) {
-            origin = (_.listWidth / 2) + ' 50%';
+        if (_.options.fade === false) {
+            transition[_.transitionType] = _.transformType + ' ' + _.options.speed + 'ms ' + _.options.cssEase;
         } else {
-            origin = '';
+            transition[_.transitionType] = 'opacity ' + _.options.speed + 'ms ' + _.options.cssEase;
         }
 
         if (_.options.fade === false) {
-            _.slideTrack.css({
-                transition: transition,
-                transformOrigin: origin
-            });
+            _.$slideTrack.css(transition);
         } else {
-            $(_.slides.get(slide)).css({
-                transition: transition
-            });
+            _.$slides.eq(slide).css(transition);
         }
 
     };
 
-    Slick.prototype.autoPlay = function () {
+    Slick.prototype.autoPlay = function() {
 
         var _ = this;
 
@@ -299,14 +287,14 @@
             clearInterval(_.autoPlayTimer);
         }
 
-        if(_.slideCount > _.options.slidesToShow && _.paused !== true) {
+        if (_.slideCount > _.options.slidesToShow && _.paused !== true) {
             _.autoPlayTimer = setInterval(_.autoPlayIterator,
                 _.options.autoplaySpeed);
         }
 
     };
 
-    Slick.prototype.autoPlayClear = function () {
+    Slick.prototype.autoPlayClear = function() {
 
         var _ = this;
 
@@ -316,7 +304,7 @@
 
     };
 
-    Slick.prototype.autoPlayIterator = function () {
+    Slick.prototype.autoPlayIterator = function() {
 
         var _ = this;
 
@@ -353,101 +341,81 @@
 
     };
 
-    Slick.prototype.buildArrows = function () {
+    Slick.prototype.buildArrows = function() {
 
         var _ = this;
 
         if (_.options.arrows === true && _.slideCount > _.options.slidesToShow) {
 
-            _.prevArrow = $(
-                '<button type="button" tabIndex="-1">Previous</button>').appendTo(
-                _.slider).addClass('slick-prev');
-            _.nextArrow = $(
-                '<button type="button" tabIndex="-1">Next</button>').appendTo(
-                _.slider).addClass('slick-next');
+            _.$prevArrow = $(
+                '<button type="button" class="slick-prev">Previous</button>').appendTo(
+                _.$slider);
+            _.$nextArrow = $(
+                '<button type="button" class="slick-next">Next</button>').appendTo(
+                _.$slider);
 
             if (_.options.infinite !== true) {
-                _.prevArrow.addClass('slick-disabled');
+                _.$prevArrow.addClass('slick-disabled');
             }
 
         }
 
     };
 
-    Slick.prototype.buildDots = function () {
+    Slick.prototype.buildDots = function() {
 
-        var _ = this, i, dotString;
+        var _ = this,
+            i, dotString;
 
         if (_.options.dots === true && _.slideCount > _.options.slidesToShow) {
 
             dotString = '<ul class="slick-dots">';
 
-            for (i = 1; i <= _.slideCount; i += 1) {
-
-                dotString += '<li><a href="javascript:void(0)" tabIndex="-1">' + i +
-                    '</a></li>';
-                if (_.options.placeholders === false && i +
-                _.options.slidesToShow - (_.options.slidesToScroll - 1) > _.slideCount) {
-                    break;
-                }
+            for (i = 0; i <= _.getDotCount(); i += 1) {
+                dotString += '<li>' + _.options.customPaging.call(this, _, i) + '</li>';
             }
 
-            dotString += "</ul>";
+            dotString += '</ul>';
 
-            _.dots = $(dotString).appendTo(
-                _.slider);
+            _.$dots = $(dotString).appendTo(
+                _.$slider);
 
-            if (_.options.slidesToScroll > 1) {
-                _.dots.find('li').hide();
-                i = 0;
-                while (i < _.slideCount) {
-                    $(_.dots.find('li').get(i)).show();
-                    i = i + _.options.slidesToScroll;
-                }
-            }
-
-            _.dots.find('li').first().addClass(
+            _.$dots.find('li').first().addClass(
                 'slick-active');
 
         }
 
     };
 
-    Slick.prototype.buildOut = function () {
+    Slick.prototype.buildOut = function() {
 
         var _ = this;
 
-        _.slides = _.slider.children(_.options.slide +
+        _.$slides = _.$slider.children(_.options.slide +
             ':not(.slick-cloned)').addClass(
             'slick-slide');
-        _.slideCount = _.slides.length;
-        _.slidesCache = _.slides;
+        _.slideCount = _.$slides.length;
+        _.$slidesCache = _.$slides;
 
-        _.slider.addClass("slick-slider");
+        _.$slider.addClass('slick-slider');
 
-        _.slideTrack = (_.slideCount === 0) ?
-            $('<div class="slick-track"/>').appendTo(_.slider) :
-            _.slides.wrapAll('<div class="slick-track"/>').parent();
+        _.$slideTrack = (_.slideCount === 0) ?
+            $('<div class="slick-track"/>').appendTo(_.$slider) :
+            _.$slides.wrapAll('<div class="slick-track"/>').parent();
 
-        _.list = _.slideTrack.wrap(
+        _.$list = _.$slideTrack.wrap(
             '<div class="slick-list"/>').parent();
-        _.slideTrack.css('opacity', 0);
-
-        if(_.options.accessibility === true) {
-            _.list.prop('tabIndex',0);
-        }
+        _.$slideTrack.css('opacity', 0);
 
-        if(_.options.centerMode === true) {
+        if (_.options.centerMode === true) {
             _.options.infinite = true;
             _.options.slidesToScroll = 1;
-            if(_.options.slidesToShow % 2 === 0) {
+            if (_.options.slidesToShow % 2 === 0) {
                 _.options.slidesToShow = 3;
             }
         }
 
-        $('img[data-lazy]',_.slider).not('[src]').addClass('slick-loading');
-
-        _.setupPlaceholders();
+        $('img[data-lazy]', _.$slider).not('[src]').addClass('slick-loading');
 
         _.setupInfinite();
 
@@ -455,17 +423,22 @@
 
         _.buildDots();
 
+        if (_.options.accessibility === true) {
+            _.$list.prop('tabIndex', 0);
+        }
+
         _.setSlideClasses(0);
 
         if (_.options.draggable === true) {
-            _.list.addClass('draggable');
+            _.$list.addClass('draggable');
         }
 
     };
 
-    Slick.prototype.checkResponsive = function () {
+    Slick.prototype.checkResponsive = function() {
 
-        var _ = this, breakpoint, targetBreakpoint;
+        var _ = this,
+            breakpoint, targetBreakpoint;
 
         if (_.originalSettings.responsive && _.originalSettings
             .responsive.length > -1 && _.originalSettings.responsive !== null) {
@@ -490,21 +463,21 @@
                         _.options = $.extend({}, _.defaults,
                             _.breakpointSettings[
                                 targetBreakpoint]);
-                            _.refresh();
+                        _.refresh();
                     }
                 } else {
                     _.activeBreakpoint = targetBreakpoint;
                     _.options = $.extend({}, _.defaults,
                         _.breakpointSettings[
                             targetBreakpoint]);
-                        _.refresh();
+                    _.refresh();
                 }
             } else {
                 if (_.activeBreakpoint !== null) {
                     _.activeBreakpoint = null;
                     _.options = $.extend({}, _.defaults,
                         _.originalSettings);
-                        _.refresh();
+                    _.refresh();
                 }
             }
 
@@ -512,33 +485,33 @@
 
     };
 
-    Slick.prototype.changeSlide = function (event) {
+    Slick.prototype.changeSlide = function(event) {
 
         var _ = this;
 
         switch (event.data.message) {
 
-        case 'previous':
-            _.slideHandler(_.currentSlide - _.options
-                .slidesToScroll);
-            break;
+            case 'previous':
+                _.slideHandler(_.currentSlide - _.options
+                    .slidesToScroll);
+                break;
 
-        case 'next':
-            _.slideHandler(_.currentSlide + _.options
-            .slidesToScroll);
-            break;
+            case 'next':
+                _.slideHandler(_.currentSlide + _.options
+                    .slidesToScroll);
+                break;
 
-        case 'index':
-            _.slideHandler($(event.target).parent().index());
-            break;
+            case 'index':
+                _.slideHandler($(event.target).parent().index() * _.options.slidesToScroll);
+                break;
 
-        default:
-            return false;
+            default:
+                return false;
         }
 
     };
 
-    Slick.prototype.destroy = function () {
+    Slick.prototype.destroy = function() {
 
         var _ = this;
 
@@ -546,69 +519,68 @@
 
         _.touchObject = {};
 
-        $('.slick-cloned', _.slider).remove();
-        $('.slick-placeholder', _.slider).remove();
-        if (_.dots) {
-            _.dots.remove();
+        $('.slick-cloned', _.$slider).remove();
+        if (_.$dots) {
+            _.$dots.remove();
         }
-        if (_.prevArrow) {
-            _.prevArrow.remove();
-            _.nextArrow.remove();
+        if (_.$prevArrow) {
+            _.$prevArrow.remove();
+            _.$nextArrow.remove();
         }
-        _.slides.unwrap().unwrap();
-        _.slides.removeClass(
+        _.$slides.unwrap().unwrap();
+        _.$slides.removeClass(
             'slick-slide slick-active slick-visible').removeAttr('style');
-        _.slider.removeClass('slick-slider');
-        _.slider.removeClass('slick-initialized');
+        _.$slider.removeClass('slick-slider');
+        _.$slider.removeClass('slick-initialized');
 
-        _.list.off('.slick');
-        $(window).off('.slick'+_.instanceUid);
+        _.$list.off('.slick');
+        $(window).off('.slick-' + _.instanceUid);
     };
 
-    Slick.prototype.disableTransition = function (slide) {
+    Slick.prototype.disableTransition = function(slide) {
 
-        var _ = this;
+        var _ = this,
+            transition = {};
+
+        transition[_.transitionType] = "";
 
         if (_.options.fade === false) {
-            _.slideTrack.css({
-                transition: '',
-                transformOrigin: ''
-            });
+            _.$slideTrack.css(transition);
         } else {
-            $(_.slides.get(slide)).css({
-                transition: ''
-            });
+            _.$slides.eq(slide).css(transition);
         }
 
     };
 
-    Slick.prototype.fadeSlide = function (slideIndex, callback) {
+    Slick.prototype.fadeSlide = function(slideIndex, callback) {
 
         var _ = this;
 
-        if(_.cssTransitions === false) {
+        if (_.cssTransitions === false) {
 
-            $(_.slides.get(slideIndex)).css({zIndex: 1000});
+            _.$slides.eq(slideIndex).css({
+                zIndex: 1000
+            });
 
-            $(_.slides.get(slideIndex)).animate({
+            _.$slides.eq(slideIndex).animate({
                 opacity: 1
-            }, _.options.speed,_.options.easing, callback);
+            }, _.options.speed, _.options.easing, callback);
 
         } else {
 
             _.applyTransition(slideIndex);
 
-            $(_.slides.get(slideIndex)).css({
+            _.$slides.eq(slideIndex).css({
                 opacity: 1,
                 zIndex: 1000
             });
 
-            if(callback) {
-                setTimeout(function(){
+            if (callback) {
+                setTimeout(function() {
 
-                _.disableTransition(slideIndex);
+                    _.disableTransition(slideIndex);
 
-                callback.call();
+                    callback.call();
                 }, _.options.speed);
             }
 
@@ -616,17 +588,17 @@
 
     };
 
-    Slick.prototype.filterSlides = function (filter) {
+    Slick.prototype.filterSlides = function(filter) {
 
         var _ = this;
 
-        if(filter !== null) {
+        if (filter !== null) {
 
             _.unload();
 
-            _.slideTrack.children(this.options.slide).remove();
+            _.$slideTrack.children(this.options.slide).remove();
 
-            _.slidesCache.filter(filter).appendTo(_.slideTrack);
+            _.$slidesCache.filter(filter).appendTo(_.$slideTrack);
 
             _.reinit();
 
@@ -634,13 +606,76 @@
 
     };
 
-    Slick.prototype.init = function () {
+    Slick.prototype.getDotCount = function() {
+
+        var _ = this,
+            breaker = 0,
+            dotCounter = 0,
+            dotCount = 0,
+            dotLimit;
+
+        dotLimit = _.options.infinite === true ? _.slideCount + _.options.slidesToShow - _.options.slidesToScroll : _.slideCount;
+
+        while (breaker < dotLimit) {
+            dotCount++;
+            dotCounter += _.options.slidesToScroll;
+            breaker = dotCounter + _.options.slidesToShow;
+        }
+
+        return dotCount;
+
+    };
+
+    Slick.prototype.getLeft = function(slideIndex) {
+
+        var _ = this,
+            targetLeft;
+
+        _.slideOffset = 0;
+
+        if (_.options.infinite === true) {
+            if (_.slideCount > _.options.slidesToShow) {
+                _.slideOffset = (_.slideWidth * _.options.slidesToShow) * -1;
+            }
+            if (_.slideCount % _.options.slidesToScroll !== 0) {
+                if (slideIndex + _.options.slidesToScroll > _.slideCount && _.slideCount > _.options.slidesToShow) {
+                    _.slideOffset = ((_.slideCount % _.options.slidesToShow) * _.slideWidth) * -1;
+                }
+            }
+        } else {
+            if (_.slideCount % _.options.slidesToShow !== 0) {
+                if (slideIndex + _.options.slidesToScroll > _.slideCount && _.slideCount > _.options.slidesToShow) {
+                    _.slideOffset = ((_.slideCount % _.options.slidesToShow) * _.slideWidth);
+                }
+            }
+        }
+
+        if (_.options.centerMode === true) {
+            _.slideOffset += _.slideWidth * Math.floor(_.options.slidesToShow / 2) - _.slideWidth;
+        }
+
+        if (_.options.vertical === false) {
+            targetLeft = ((slideIndex * _.slideWidth) * -1) + _.slideOffset;
+        } else {
+            _.listHeight = _.$list.height();
+            if (_.options.infinite === true) {
+                targetLeft = ((slideIndex * _.listHeight) * -1) - _.listHeight;
+            } else {
+                targetLeft = ((slideIndex * _.listHeight) * -1);
+            }
+        }
+
+        return targetLeft;
+
+    };
+
+    Slick.prototype.init = function() {
 
         var _ = this;
 
-        if (!$(_.slider).hasClass('slick-initialized')) {
+        if (!$(_.$slider).hasClass('slick-initialized')) {
 
-            $(_.slider).addClass('slick-initialized');
+            $(_.$slider).addClass('slick-initialized');
             _.buildOut();
             _.setProps();
             _.startLoad();
@@ -655,34 +690,34 @@
 
     };
 
-    Slick.prototype.initArrowEvents = function () {
+    Slick.prototype.initArrowEvents = function() {
 
         var _ = this;
 
         if (_.options.arrows === true && _.slideCount > _.options.slidesToShow) {
-            _.prevArrow.on('click.slick', {
+            _.$prevArrow.on('click.slick', {
                 message: 'previous'
             }, _.changeSlide);
-            _.nextArrow.on('click.slick', {
+            _.$nextArrow.on('click.slick', {
                 message: 'next'
             }, _.changeSlide);
         }
 
     };
 
-    Slick.prototype.initDotEvents = function () {
+    Slick.prototype.initDotEvents = function() {
 
         var _ = this;
 
         if (_.options.dots === true && _.slideCount > _.options.slidesToShow) {
-            $('li a', _.dots).on('click.slick', {
+            $('li', _.$dots).on('click.slick', {
                 message: 'index'
             }, _.changeSlide);
         }
 
     };
 
-    Slick.prototype.initializeEvents = function () {
+    Slick.prototype.initializeEvents = function() {
 
         var _ = this;
 
@@ -690,60 +725,39 @@
 
         _.initDotEvents();
 
-        if (_.options.swipe === true) {
-            _.list.on('touchstart.slick', {
-                action: 'start',
-                kind: 'touch'
-            }, _.swipeHandler);
-            _.list.on('touchmove.slick', {
-                action: 'move',
-                kind: 'touch'
-            }, _.swipeHandler);
-            _.list.on('touchend.slick', {
-                action: 'end',
-                kind: 'touch'
-            }, _.swipeHandler);
-            _.list.on('touchcancel.slick', {
-                action: 'end',
-                kind: 'touch'
-            }, _.swipeHandler);
-        }
-
-        if (_.options.draggable === true) {
-            _.list.on('mousedown.slick', {
-                action: 'start',
-                kind: 'drag'
-            }, _.swipeHandler);
-            _.list.on('mousemove.slick', {
-                action: 'move',
-                kind: 'drag'
-            }, _.swipeHandler);
-            _.list.on('mouseup.slick', {
-                action: 'end',
-                kind: 'drag'
-            }, _.swipeHandler);
-            _.list.on('mouseleave.slick', {
-                action: 'end',
-                kind: 'drag'
-            }, _.swipeHandler);
-        }
+        _.$list.on('touchstart.slick mousedown.slick', {
+            action: 'start'
+        }, _.swipeHandler);
+        _.$list.on('touchmove.slick mousemove.slick', {
+            action: 'move'
+        }, _.swipeHandler);
+        _.$list.on('touchend.slick mouseup.slick', {
+            action: 'end'
+        }, _.swipeHandler);
+        _.$list.on('touchcancel.slick mouseleave.slick', {
+            action: 'end'
+        }, _.swipeHandler);
+
+        _.$list.on('dragstart.slick', function(e) {
+            e.preventDefault();
+        });
 
         if (_.options.pauseOnHover === true && _.options.autoplay === true) {
-            _.list.on('mouseenter.slick', _.autoPlayClear);
-            _.list.on('mouseleave.slick', _.autoPlay);
+            _.$list.on('mouseenter.slick', _.autoPlayClear);
+            _.$list.on('mouseleave.slick', _.autoPlay);
         }
 
-        _.list.on('keydown.slick', _.keyHandler);
+        _.$list.on('keydown.slick', _.keyHandler);
 
-        $(window).on('orientationchange.slick.slick'+_.instanceUid, function(){
+        $(window).on('orientationchange.slick.slick-' + _.instanceUid, function() {
             _.checkResponsive();
             _.setPosition();
         });
 
-        $(window).on('resize.slick.slick'+_.instanceUid, function () {
+        $(window).on('resize.slick.slick-' + _.instanceUid, function() {
             if ($(window).width !== _.windowWidth) {
                 clearTimeout(_.windowDelay);
-                _.windowDelay = window.setTimeout(function () {
+                _.windowDelay = window.setTimeout(function() {
                     _.windowWidth = $(window).width();
                     _.checkResponsive();
                     _.setPosition();
@@ -751,23 +765,24 @@
             }
         });
 
-        $(window).on('load.slick.slick'+_.instanceUid, _.setPosition);
+        $(window).on('load.slick.slick-' + _.instanceUid, _.setPosition);
+
     };
 
-    Slick.prototype.initUI = function () {
+    Slick.prototype.initUI = function() {
 
         var _ = this;
 
         if (_.options.arrows === true && _.slideCount > _.options.slidesToShow) {
 
-            _.prevArrow.show();
-            _.nextArrow.show();
+            _.$prevArrow.show();
+            _.$nextArrow.show();
 
         }
 
         if (_.options.dots === true && _.slideCount > _.options.slidesToShow) {
 
-            _.dots.show();
+            _.$dots.show();
 
         }
 
@@ -779,65 +794,74 @@
 
     };
 
-    Slick.prototype.keyHandler = function (event) {
+    Slick.prototype.keyHandler = function(event) {
 
         var _ = this;
 
         if (event.keyCode === 37) {
-            _.changeSlide({data: {message: 'previous'}});
+            _.changeSlide({
+                data: {
+                    message: 'previous'
+                }
+            });
         } else if (event.keyCode === 39) {
-            _.changeSlide({data: {message: 'next'}});
+            _.changeSlide({
+                data: {
+                    message: 'next'
+                }
+            });
         }
 
     };
 
-    Slick.prototype.lazyLoad = function (){
+    Slick.prototype.lazyLoad = function() {
 
-        var _ = this, loadRange, cloneRange, rangeStart, rangeEnd;
+        var _ = this,
+            loadRange, cloneRange, rangeStart, rangeEnd;
 
         if (_.options.centerMode === true) {
             rangeStart = _.options.slidesToShow + _.currentSlide - 1;
             rangeEnd = rangeStart + _.options.slidesToShow + 2;
         } else {
-            rangeStart = _.options.slidesToShow + _.currentSlide;
+            rangeStart = _.options.infinite ? _.options.slidesToShow + _.currentSlide : _.currentSlide;
             rangeEnd = rangeStart + _.options.slidesToShow;
         }
 
-        loadRange = _.slider.find('.slick-slide').slice(rangeStart,rangeEnd);
+        loadRange = _.$slider.find('.slick-slide').slice(rangeStart, rangeEnd);
 
-        $('img[data-lazy]',loadRange).not('[src]').each(function(){
+        $('img[data-lazy]', loadRange).not('[src]').each(function() {
             $(this).attr('src', $(this).attr('data-lazy')).removeClass('slick-loading');
         });
 
         if (_.currentSlide >= _.slideCount - _.options.slidesToShow) {
-            cloneRange = _.slider.find('.slick-cloned').slice(0,_.options.slidesToShow);
-            $('img[data-lazy]',cloneRange).not('[src]').each(function(){
+            cloneRange = _.$slider.find('.slick-cloned').slice(0, _.options.slidesToShow);
+            $('img[data-lazy]', cloneRange).not('[src]').each(function() {
                 $(this).attr('src', $(this).attr('data-lazy')).removeClass('slick-loading');
             });
         } else if (_.currentSlide === 0) {
-            cloneRange = _.slider.find('.slick-cloned').slice(_.options.slidesToShow * -1);
-            $('img[data-lazy]',cloneRange).not('[src]').each(function(){
+            cloneRange = _.$slider.find('.slick-cloned').slice(_.options.slidesToShow * -1);
+            $('img[data-lazy]', cloneRange).not('[src]').each(function() {
                 $(this).attr('src', $(this).attr('data-lazy')).removeClass('slick-loading');
             });
         }
 
     };
 
-    Slick.prototype.loadSlider = function () {
+    Slick.prototype.loadSlider = function() {
 
         var _ = this;
 
         _.setPosition();
 
-        _.slideTrack.css({
+        _.$slideTrack.css({
             opacity: 1
         });
 
-        if (document.readyState !== "complete") {
+        if (document.readyState !== 'complete') {
 
-            $(window).load(function () {
+            $(window).load(function() {
 
-                _.slider.removeClass('slick-loading');
+                _.$slider.removeClass('slick-loading');
 
                 _.initUI();
 
@@ -849,7 +873,7 @@
 
         } else {
 
-            _.slider.removeClass('slick-loading');
+            _.$slider.removeClass('slick-loading');
 
             _.initUI();
 
@@ -861,7 +885,7 @@
 
     };
 
-    Slick.prototype.postSlide = function (index) {
+    Slick.prototype.postSlide = function(index) {
 
         var _ = this;
 
@@ -889,22 +913,23 @@
 
     };
 
-    Slick.prototype.progressiveLazyLoad = function () {
+    Slick.prototype.progressiveLazyLoad = function() {
 
-        var _ = this, imgCount, targetImage;
+        var _ = this,
+            imgCount, targetImage;
 
         imgCount = $('img[data-lazy]').not('[src]').length;
 
-        if(imgCount > 0) {
-            targetImage = $($('img[data-lazy]', _.slider).not('[src]').get(0));
-            targetImage.attr('src', targetImage.attr('data-lazy')).removeClass('slick-loading').load(function(){
+        if (imgCount > 0) {
+            targetImage = $($('img[data-lazy]', _.$slider).not('[src]').get(0));
+            targetImage.attr('src', targetImage.attr('data-lazy')).removeClass('slick-loading').load(function() {
                 _.progressiveLazyLoad();
             });
         }
 
     };
 
-    Slick.prototype.refresh = function () {
+    Slick.prototype.refresh = function() {
 
         var _ = this;
 
@@ -916,24 +941,22 @@
 
     };
 
-    Slick.prototype.reinit = function () {
+    Slick.prototype.reinit = function() {
 
         var _ = this;
 
-        _.slides = $(_.options.slide +
-            ':not(.slick-cloned)', _.slideTrack).addClass(
+        _.$slides = $(_.options.slide +
+            ':not(.slick-cloned)', _.$slideTrack).addClass(
             'slick-slide');
 
-        _.slideCount = _.slides.length;
+        _.slideCount = _.$slides.length;
 
-        if(_.currentSlide >= _.slideCount && _.currentSlide !== 0) {
+        if (_.currentSlide >= _.slideCount && _.currentSlide !== 0) {
             _.currentSlide = _.currentSlide - _.options.slidesToScroll;
         }
 
         _.setProps();
 
-        _.setupPlaceholders();
-
         _.setupInfinite();
 
         _.buildArrows();
@@ -958,55 +981,39 @@
 
     };
 
-    Slick.prototype.removeSlide = function (index, removeBefore) {
+    Slick.prototype.removeSlide = function(index, removeBefore) {
 
         var _ = this;
 
-        if (typeof(index) === "boolean") {
+        if (typeof(index) === 'boolean') {
             removeBefore = index;
-            index = null;
-        }
-
-        _.unload();
-
-        if (_.slideCount < 1) {
-            return false;
-        }
-
-        if (typeof(index) === "number") {
-            if (removeBefore === true) {
-                --index;
-            } else if (removeBefore === false) {
-               ++index;
-            }
+            index = removeBefore === true ? 0 : _.slideCount - 1;
         } else {
-            if (removeBefore === true) {
-                index = 0;
-            } else {
-                index = $(_.slideTrack.children(this.options.slide)).length - 1;
-            }
+            index = removeBefore === true ? --index : index;
         }
 
-        if (index < 0 || index >= $(_.slideTrack.children(this.options.slide)).length) {
-            _.reinit();
+        if (_.slideCount < 1 || index < 0 || index > _.slideCount - 1) {
             return false;
         }
 
-        $(_.slideTrack.children(this.options.slide).get(index)).remove();
+        _.unload();
+
+        _.$slideTrack.children(this.options.slide).eq(index).remove();
 
-        _.slides = _.slideTrack.children(this.options.slide);
+        _.$slides = _.$slideTrack.children(this.options.slide);
 
-        _.slideTrack.children(this.options.slide).remove();
+        _.$slideTrack.children(this.options.slide).remove();
 
-        _.slideTrack.append(_.slides);
+        _.$slideTrack.append(_.$slides);
 
         _.reinit();
 
     };
 
-    Slick.prototype.setCSS = function (position) {
+    Slick.prototype.setCSS = function(position) {
 
-        var _ = this, positionProps = {}, x, y;
+        var _ = this,
+            positionProps = {}, x, y;
 
         x = _.positionProp == 'left' ? position + 'px' : '0px';
         y = _.positionProp == 'top' ? position + 'px' : '0px';
@@ -1014,53 +1021,58 @@
         positionProps[_.positionProp] = position;
 
         if (_.transformsEnabled === false) {
-            _.slideTrack.css(positionProps);
+            _.$slideTrack.css(positionProps);
         } else {
             positionProps = {};
-            if(_.cssTransitions === false) {
-                positionProps[_.animType] = "translate(" + x + ", " + y + ")";
-                _.slideTrack.css(positionProps);
+            if (_.cssTransitions === false) {
+                positionProps[_.animType] = 'translate(' + x + ', ' + y + ')';
+                _.$slideTrack.css(positionProps);
             } else {
-                positionProps[_.animType] = "translate3d(" + x + ", " + y + ", 0px)";
-                _.slideTrack.css(positionProps);
+                positionProps[_.animType] = 'translate3d(' + x + ', ' + y + ', 0px)';
+                _.$slideTrack.css(positionProps);
             }
         }
 
     };
 
-    Slick.prototype.setDimensions = function () {
+    Slick.prototype.setDimensions = function() {
 
         var _ = this;
 
-        if(_.options.centerMode === true) {
-            _.list.find('.slick-slide').width(_.slideWidth);
+        if (_.options.centerMode === true) {
+            _.$list.find('.slick-slide').width(_.slideWidth);
         } else {
-            _.list.find('.slick-slide').width(_.slideWidth);
+            _.$list.find('.slick-slide').width(_.slideWidth);
         }
 
 
         if (_.options.vertical === false) {
-            _.slideTrack.width(Math.ceil((_.slideWidth * _
-                .slider.find('.slick-slide').length)));
-            if(_.options.centerMode ===  true) {
-                _.list.css({padding: ('0px ' + _.options.centerPadding + 'px')});
+            _.$slideTrack.width(Math.ceil((_.slideWidth * _
+                .$slider.find('.slick-slide').length)));
+            if (_.options.centerMode === true) {
+                _.$list.css({
+                    padding: ('0px ' + _.options.centerPadding)
+                });
             }
         } else {
-            _.list.height(_.slides.first().outerHeight());
-            _.slideTrack.height(Math.ceil((_.listHeight * _
-                .slider.find('.slick-slide').length)));
-                if(_.options.centerMode ===  true) {
-                _.list.css({padding: (_.options.centerPadding + 'px 0px')});
+            _.$list.height(_.$slides.first().outerHeight());
+            _.$slideTrack.height(Math.ceil((_.listHeight * _
+                .$slider.find('.slick-slide').length)));
+            if (_.options.centerMode === true) {
+                _.$list.css({
+                    padding: (_.options.centerPadding + ' 0px')
+                });
             }
         }
 
     };
 
-    Slick.prototype.setFade = function () {
+    Slick.prototype.setFade = function() {
 
-        var _ = this, targetLeft;
+        var _ = this,
+            targetLeft;
 
-        _.slides.each(function (index,element) {
+        _.$slides.each(function(index, element) {
             targetLeft = (_.slideWidth * index) * -1;
             $(element).css({
                 position: 'relative',
@@ -1071,122 +1083,108 @@
             });
         });
 
-        $(_.slides.get(_.currentSlide)).css({
+        _.$slides.eq(_.currentSlide).css({
             zIndex: 900,
             opacity: 1
         });
 
     };
 
-    Slick.prototype.setPosition = function () {
+    Slick.prototype.setPosition = function() {
 
-        var _ = this, targetPosition, targetSlide;
-
-        targetSlide = _.currentSlide;
+        var _ = this;
 
         _.setValues();
         _.setDimensions();
 
-        _.slideOffset = 0;
-
-        if (_.options.infinite === true) {
-            if(_.slideCount > _.options.slidesToShow) {
-                _.slideOffset = (_.slideWidth * _.options.slidesToShow) * -1;
-            }
-        }
-
-        if (_.options.centerMode === true) {
-            _.slideOffset += _.slideWidth * Math.floor(_.options.slidesToShow / 2) - _.slideWidth;
-        }
-
-        if (_.options.placeholders === false) {
-            if(_.currentSlide + _.options.slidesToScroll >= _.slideCount - _.options.slidesToScroll) {
-                _.slideOffset = _.slideOffset - ((_.slideWidth * _.placeholderOffset) * -1);
-            }
-        }
-
         if (_.options.fade === false) {
-            if (_.options.vertical === false) {
-                targetPosition = ((targetSlide *
-                        _.slideWidth) * -1) + _.slideOffset;
-            } else {
-                targetPosition = ((targetSlide *
-                        _.listHeight) * -1) - _.listHeight;
-            }
-            _.setCSS(targetPosition);
+            _.setCSS(_.getLeft(_.currentSlide));
         } else {
             _.setFade();
         }
 
     };
 
-    Slick.prototype.setProps = function () {
+    Slick.prototype.setProps = function() {
 
         var _ = this;
 
         _.positionProp = _.options.vertical === true ? 'top' : 'left';
 
         if (_.positionProp === 'top') {
-            _.slider.addClass('slick-vertical');
+            _.$slider.addClass('slick-vertical');
         } else {
-            _.slider.removeClass('slick-vertical');
+            _.$slider.removeClass('slick-vertical');
         }
 
-        if ( document.body.style.WebkitTransition !== undefined ||
-             document.body.style.MozTransition !== undefined ||
-             document.body.style.msTransition !== undefined ) {
-                _.cssTransitions = true;
+        if (document.body.style.WebkitTransition !== undefined ||
+            document.body.style.MozTransition !== undefined ||
+            document.body.style.msTransition !== undefined) {
+            _.cssTransitions = true;
         }
 
-        if (document.body.style.MozTransform !== undefined) _.animType = 'MozTransform';
-        if (document.body.style.webkitTransform !== undefined) _.animType = 'webkitTransform';
-        if (document.body.style.msTransform !== undefined) _.animType = 'msTransform';
+        if (document.body.style.MozTransform !== undefined) {
+            _.animType = 'MozTransform';
+            _.transformType = "-moz-transform";
+            _.transitionType = 'MozTransition';
+        }
+        if (document.body.style.webkitTransform !== undefined) {
+            _.animType = 'webkitTransform';
+            _.transformType = "-webkit-transform";
+            _.transitionType = 'webkitTransition';
+        }
+        if (document.body.style.msTransform !== undefined) {
+            _.animType = 'transform';
+            _.transformType = "transform";
+            _.transitionType = 'transition';
+        }
 
         _.transformsEnabled = (_.animType !== null);
 
     };
 
-    Slick.prototype.setValues = function () {
+    Slick.prototype.setValues = function() {
 
         var _ = this;
 
-        _.listWidth = _.list.width();
-        _.listHeight = _.list.height();
+        _.listWidth = _.$list.width();
+        _.listHeight = _.$list.height();
         _.slideWidth = Math.ceil(_.listWidth / _.options
             .slidesToShow);
 
     };
 
-    Slick.prototype.setSlideClasses = function (index) {
+    Slick.prototype.setSlideClasses = function(index) {
 
-        var _ = this, centerOffset, allSlides, indexOffset;
+        var _ = this,
+            centerOffset, allSlides, indexOffset;
 
-        _.slider.find('.slick-slide').removeClass('slick-active').removeClass('slick-center');
-        allSlides = _.slider.find('.slick-slide');
+        _.$slider.find('.slick-slide').removeClass('slick-active').removeClass('slick-center');
+        allSlides = _.$slider.find('.slick-slide');
 
         if (_.options.centerMode === true) {
 
             centerOffset = Math.floor(_.options.slidesToShow / 2);
 
-            if(index >= centerOffset && index <= (_.slideCount - 1) -  centerOffset) {
-                _.slides.slice(index - centerOffset, index + centerOffset + 1).addClass('slick-active');
+            if (index >= centerOffset && index <= (_.slideCount - 1) - centerOffset) {
+                _.$slides.slice(index - centerOffset, index + centerOffset + 1).addClass('slick-active');
             } else {
                 indexOffset = _.options.slidesToShow + index;
                 allSlides.slice(indexOffset - centerOffset + 1, indexOffset + centerOffset + 2).addClass('slick-active');
             }
 
-            if(index === 0) {
-                $(allSlides.get(allSlides.length - 1 - _.options.slidesToShow)).addClass('slick-center');
+            if (index === 0) {
+                allSlides.eq(allSlides.length - 1 - _.options.slidesToShow).addClass('slick-center');
             } else if (index === _.slideCount - 1) {
-                $(allSlides.get(_.options.slidesToShow)).addClass('slick-center');
+                allSlides.eq(_.options.slidesToShow).addClass('slick-center');
             }
 
-            $(_.slides.get(index)).addClass('slick-center');
+            _.$slides.eq(index).addClass('slick-center');
 
         } else {
 
-            if(index > 0 && index < (_.slideCount - _.options.slidesToShow)) {
-                _.slides.slice(index, index + _.options.slidesToShow).addClass('slick-active');
+            if (index > 0 && index < (_.slideCount - _.options.slidesToShow)) {
+                _.$slides.slice(index, index + _.options.slidesToShow).addClass('slick-active');
             } else {
                 indexOffset = _.options.slidesToShow + index;
                 allSlides.slice(indexOffset, indexOffset + _.options.slidesToShow).addClass('slick-active');
@@ -1200,9 +1198,16 @@
 
     };
 
-    Slick.prototype.setupInfinite = function () {
+    Slick.prototype.setupInfinite = function() {
+
+        var _ = this,
+            i, slideIndex, infiniteCount;
 
-        var _ = this, i, slideIndex, infiniteCount;
+        if (_.options.fade === true || _.options.vertical === true) {
+            _.options.slidesToShow = 1;
+            _.options.slidesToScroll = 1;
+            _.options.centerMode = false;
+        }
 
         if (_.options.infinite === true && _.options.fade === false) {
 
@@ -1210,7 +1215,7 @@
 
             if (_.slideCount > _.options.slidesToShow) {
 
-                if(_.options.centerMode === true) {
+                if (_.options.centerMode === true) {
                     infiniteCount = _.options.slidesToShow + 1;
                 } else {
                     infiniteCount = _.options.slidesToShow;
@@ -1219,14 +1224,17 @@
                 for (i = _.slideCount; i > (_.slideCount -
                     infiniteCount); i -= 1) {
                     slideIndex = i - 1;
-                    $(_.slides[slideIndex]).clone().prependTo(
-                        _.slideTrack).addClass('slick-cloned');
+                    $(_.$slides[slideIndex]).clone().attr('id', '').prependTo(
+                        _.$slideTrack).addClass('slick-cloned');
                 }
                 for (i = 0; i < infiniteCount; i += 1) {
                     slideIndex = i;
-                    $(_.slides[slideIndex]).clone().appendTo(
-                        _.slideTrack).addClass('slick-cloned');
+                    $(_.$slides[slideIndex]).clone().attr('id', '').appendTo(
+                        _.$slideTrack).addClass('slick-cloned');
                 }
+                _.$slideTrack.find('.slick-cloned').find('[id]').each(function() {
+                    $(this).attr('id', '');
+                });
 
             }
 
@@ -1234,75 +1242,22 @@
 
     };
 
-    Slick.prototype.setupPlaceholders = function () {
-
-        var _ = this, i, placeholders;
-
-        if(_.options.fade === true || _.options.vertical === true) {
-            _.options.slidesToShow = 1;
-            _.options.slidesToScroll = 1;
-            _.options.centerMode = false;
-        }
-
-        if(_.options.placeholders === false) {
-            _.options.infinite = false;
-            _.placeholderOffset = _.slideCount % _.options.slidesToScroll;
-            return false;
-        }
-
-        if ((_.slideCount % _.options.slidesToScroll) !==
-            0 && _.slideCount > _.options.slidesToShow) {
-
-            placeholders = Math.abs(_.options.slidesToScroll -
-                (_.slideCount % _.options.slidesToScroll)
-            );
-            for (i = 0; i < placeholders; i += 1) {
-                $('<div/>').appendTo(_.slideTrack).addClass(
-                    'slick-slide slick-placeholder');
-            }
-            _.slides = $('.slick-slide:not(.slick-cloned)',
-                _.slider);
-            _.slideCount = _.slides.length;
-        }
-
-    };
-
-    Slick.prototype.slideHandler = function (index) {
+    Slick.prototype.slideHandler = function(index) {
 
         var targetSlide, animSlide, slideLeft, targetLeft = null,
-            targetOffset, _ = this;
+            _ = this;
 
-        if(_.animating === true) {
+        if (_.animating === true) {
             return false;
         }
 
         targetSlide = index;
-        targetOffset = _.slideOffset;
+        targetLeft = _.getLeft(targetSlide);
+        slideLeft = _.getLeft(_.currentSlide);
 
-        if(_.options.placeholders === false) {
-            if (_.currentSlide >= _.slideCount - _.options.slidesToShow) {
-                if (targetSlide >= _.slideCount - _.options.slidesToShow) {
-                    targetSlide = _.currentSlide;
-                } else {
-                    targetOffset = 0;
-                }
-            } else if (targetSlide + _.options.slidesToScroll >= _.slideCount -
-                _.options.slidesToScroll) {
-                targetOffset = ((_.placeholderOffset * _.slideWidth));
-            }
-        }
-
-        if(_.options.vertical === false) {
-            targetLeft = ((targetSlide * _.slideWidth) * -1) + targetOffset;
-            slideLeft = ((_.currentSlide * _.slideWidth) * -1) + targetOffset;
-        } else {
-            targetLeft = ((targetSlide * _.listHeight) * -1) - _.listHeight;
-            slideLeft = ((_.currentSlide * _.listHeight) * -1) - _.listHeight;
-        }
-
-        if (_.options.infinite === false && (index < 0 || index > (_.slideCount -1))) {
+        if (_.options.infinite === false && (index < 0 || index > (_.slideCount - _.options.slidesToShow))) {
             targetSlide = _.currentSlide;
-            _.animateSlide(slideLeft, function () {
+            _.animateSlide(slideLeft, function() {
                 _.postSlide(targetSlide);
             });
             return false;
@@ -1315,7 +1270,11 @@
         _.currentLeft = _.swipeLeft === null ? slideLeft : _.swipeLeft;
 
         if (targetSlide < 0) {
-            animSlide = _.slideCount - _.options.slidesToScroll;
+            if (_.slideCount % _.options.slidesToScroll !== 0) {
+                animSlide = _.slideCount - (_.slideCount % _.options.slidesToScroll);
+            } else {
+                animSlide = _.slideCount - _.options.slidesToScroll;
+            }
         } else if (targetSlide > (_.slideCount - 1)) {
             animSlide = 0;
         } else {
@@ -1329,39 +1288,40 @@
         }
 
         if (_.options.fade === true) {
-            _.fadeSlide(animSlide, function(){
+            _.fadeSlide(animSlide, function() {
                 _.postSlide(animSlide);
             });
             return false;
         }
-        _.animateSlide(targetLeft, function () {
+
+        _.animateSlide(targetLeft, function() {
             _.postSlide(animSlide);
         });
 
     };
 
-    Slick.prototype.startLoad = function () {
+    Slick.prototype.startLoad = function() {
 
         var _ = this;
 
         if (_.options.arrows === true && _.slideCount > _.options.slidesToShow) {
 
-            _.prevArrow.hide();
-            _.nextArrow.hide();
+            _.$prevArrow.hide();
+            _.$nextArrow.hide();
 
         }
 
         if (_.options.dots === true && _.slideCount > _.options.slidesToShow) {
 
-            _.dots.hide();
+            _.$dots.hide();
 
         }
 
-        _.slider.addClass('slick-loading');
+        _.$slider.addClass('slick-loading');
 
     };
 
-    Slick.prototype.swipeDirection = function () {
+    Slick.prototype.swipeDirection = function() {
 
         var xDist, yDist, r, swipeAngle, _ = this;
 
@@ -1388,40 +1348,35 @@
 
     };
 
-    Slick.prototype.swipeEnd = function (event) {
+    Slick.prototype.swipeEnd = function(event) {
 
         var _ = this;
 
-        _.list.removeClass('dragging');
-
-        if(_.touchObject.curX === undefined) {
-            return false;
-        }
+        _.$list.removeClass('dragging');
 
-        if ((_.touchObject.fingerCount !== 0) && event.data.kind !== 'drag') {
-            _.touchObject = {};
+        if (_.touchObject.curX === undefined) {
             return false;
         }
 
         if (_.touchObject.swipeLength >= _.touchObject.minSwipe) {
 
-            $(event.target).on("click.slick", function (event) {
+            $(event.target).on('click.slick', function(event) {
                 event.stopImmediatePropagation();
                 event.stopPropagation();
                 event.preventDefault();
-                $(event.target).off("click.slick");
+                $(event.target).off('click.slick');
             });
 
             switch (_.swipeDirection()) {
                 case 'left':
                     _.slideHandler(_.currentSlide + _.options.slidesToScroll);
                     _.touchObject = {};
-                break;
+                    break;
 
                 case 'right':
                     _.slideHandler(_.currentSlide - _.options.slidesToScroll);
                     _.touchObject = {};
-                break;
+                    break;
             }
 
         } else {
@@ -1431,53 +1386,50 @@
 
     };
 
-    Slick.prototype.swipeHandler = function (event) {
+    Slick.prototype.swipeHandler = function(event) {
 
         var _ = this;
 
-        if(event.originalEvent !== undefined) {
-            _.touchObject.fingerCount = event.originalEvent.touches !== undefined ?
-                event.originalEvent.touches.length : 1;
+        if (event.originalEvent && event.originalEvent.touches && _.options.swipe === false) {
+            return false;
+        } else if (_.options.draggable === false) {
+            return false;
         }
 
+        _.touchObject.fingerCount = event.originalEvent && event.originalEvent.touches !== undefined ?
+            event.originalEvent.touches.length : 1;
+
         _.touchObject.minSwipe = _.listWidth / _.options
             .touchThreshold;
 
         switch (event.data.action) {
 
-        case 'start':
-            _.swipeStart(event);
-            break;
+            case 'start':
+                _.swipeStart(event);
+                break;
 
-        case 'move':
-            _.swipeMove(event);
-            break;
+            case 'move':
+                _.swipeMove(event);
+                break;
 
-        case 'end':
-            _.swipeEnd(event);
-            break;
+            case 'end':
+                _.swipeEnd(event);
+                break;
 
         }
 
     };
 
-    Slick.prototype.swipeMove = function (event) {
+    Slick.prototype.swipeMove = function(event) {
 
-        var _ = this, curLeft, swipeDirection, positionOffset, touches;
+        var _ = this,
+            curLeft, swipeDirection, positionOffset, touches;
 
         touches = event.originalEvent !== undefined ? event.originalEvent.touches : null;
 
-        curLeft = _.options.vertical === false ? ((_.currentSlide * _.slideWidth) * -1) +
-                _.slideOffset : ((_.currentSlide * _.listHeight) * -1) -
-                _.listHeight;
-
-        if (_.options.placeholders === false && _.currentSlide +
-            _.options.slidesToShow >= _.slideCount) {
-            curLeft = ((_.currentSlide * _.slideWidth) * -1) + _.slideOffset;
-        }
+        curLeft = _.getLeft(_.currentSlide);
 
-        if((!_.list.hasClass('dragging') && event.data.kind === 'drag') ||
-            touches && touches.length !== 1){
+        if (!_.$list.hasClass('dragging') || touches && touches.length !== 1) {
             return false;
         }
 
@@ -1493,20 +1445,20 @@
             return false;
         }
 
-        if(event.originalEvent !== undefined) {
+        if (event.originalEvent !== undefined) {
             event.preventDefault();
         }
 
         positionOffset = _.touchObject.curX > _.touchObject.startX ? 1 : -1;
 
-        if(_.options.vertical === false) {
+        if (_.options.vertical === false) {
             _.swipeLeft = curLeft + _.touchObject.swipeLength * positionOffset;
         } else {
             _.swipeLeft = curLeft + (_.touchObject
-                    .swipeLength * (_.listHeight / _.listWidth)) * positionOffset;
+                .swipeLength * (_.listHeight / _.listWidth)) * positionOffset;
         }
 
-        if(_.options.fade === true || _.options.touchMove === false) {
+        if (_.options.fade === true || _.options.touchMove === false) {
             return false;
         }
 
@@ -1519,37 +1471,38 @@
 
     };
 
-    Slick.prototype.swipeStart = function (event) {
+    Slick.prototype.swipeStart = function(event) {
 
-        var _ = this, touches;
+        var _ = this,
+            touches;
 
         if (_.touchObject.fingerCount !== 1 || _.slideCount <= _.options.slidesToShow) {
             _.touchObject = {};
             return false;
         }
 
-        if(event.originalEvent !== undefined && event.originalEvent.touches !== undefined) {
+        if (event.originalEvent !== undefined && event.originalEvent.touches !== undefined) {
             touches = event.originalEvent.touches[0];
         }
 
         _.touchObject.startX = _.touchObject.curX = touches !== undefined ? touches.pageX : event.clientX;
         _.touchObject.startY = _.touchObject.curY = touches !== undefined ? touches.pageY : event.clientY;
 
-        _.list.addClass('dragging');
+        _.$list.addClass('dragging');
 
     };
 
-    Slick.prototype.unfilterSlides = function () {
+    Slick.prototype.unfilterSlides = function() {
 
         var _ = this;
 
-        if(_.slidesCache !== null) {
+        if (_.$slidesCache !== null) {
 
             _.unload();
 
-            _.slideTrack.children(this.options.slide).remove();
+            _.$slideTrack.children(this.options.slide).remove();
 
-            _.slidesCache.appendTo(_.slideTrack);
+            _.$slidesCache.appendTo(_.$slideTrack);
 
             _.reinit();
 
@@ -1557,173 +1510,173 @@
 
     };
 
-    Slick.prototype.unload = function () {
+    Slick.prototype.unload = function() {
 
         var _ = this;
 
-        $('.slick-cloned', _.slider).remove();
-        $('.slick-placeholder', _.slider).remove();
-        if (_.dots) {
-            _.dots.remove();
+        $('.slick-cloned', _.$slider).remove();
+        if (_.$dots) {
+            _.$dots.remove();
         }
-        if (_.prevArrow) {
-            _.prevArrow.remove();
-            _.nextArrow.remove();
+        if (_.$prevArrow) {
+            _.$prevArrow.remove();
+            _.$nextArrow.remove();
         }
-        _.slides.removeClass(
+        _.$slides.removeClass(
             'slick-slide slick-active slick-visible').removeAttr('style');
 
     };
 
-    Slick.prototype.updateArrows = function () {
+    Slick.prototype.updateArrows = function() {
 
         var _ = this;
 
         if (_.options.arrows === true && _.options.infinite !==
             true && _.slideCount > _.options.slidesToShow) {
+            _.$prevArrow.removeClass('slick-disabled');
+            _.$nextArrow.removeClass('slick-disabled');
             if (_.currentSlide === 0) {
-                _.prevArrow.addClass('slick-disabled');
-                _.nextArrow.removeClass('slick-disabled');
-            } else if (_.currentSlide >= (_.slideCount /
-                _.options.slidesToScroll * _.options.slidesToShow
-            ) - _.options.slidesToScroll) {
-                _.nextArrow.addClass('slick-disabled');
-                _.prevArrow.removeClass('slick-disabled');
-            } else if (_.options.placeholders === false && _.currentSlide +
-                _.options.slidesToShow >= _.slideCount) {
-                _.nextArrow.addClass('slick-disabled');
-                _.prevArrow.removeClass('slick-disabled');
-            } else {
-                _.prevArrow.removeClass('slick-disabled');
-                _.nextArrow.removeClass('slick-disabled');
+                _.$prevArrow.addClass('slick-disabled');
+                _.$nextArrow.removeClass('slick-disabled');
+            } else if (_.currentSlide >= _.slideCount - _.options.slidesToShow) {
+                _.$nextArrow.addClass('slick-disabled');
+                _.$prevArrow.removeClass('slick-disabled');
             }
         }
 
     };
 
-    Slick.prototype.updateDots = function () {
+    Slick.prototype.updateDots = function() {
 
         var _ = this;
 
-        if(_.dots !== null) {
+        if (_.$dots !== null) {
 
-            _.dots.find('li').removeClass('slick-active');
-            $(_.dots.find('li').get(_.currentSlide)).addClass(
+            _.$dots.find('li').removeClass('slick-active');
+            _.$dots.find('li').eq(_.currentSlide / _.options.slidesToScroll).addClass(
                 'slick-active');
 
         }
 
     };
 
-    $.fn.slick = function (options) {
+    $.fn.slick = function(options) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
             element.slick = new Slick(element, options);
 
         });
     };
 
-    $.fn.slickAdd = function (slide, slideIndex, addBefore) {
+    $.fn.slickAdd = function(slide, slideIndex, addBefore) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.addSlide(slide, slideIndex, addBefore);
+            element.slick.addSlide(slide, slideIndex, addBefore);
 
         });
     };
 
-    $.fn.slickFilter = function (filter) {
+    $.fn.slickFilter = function(filter) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.filterSlides(filter);
+            element.slick.filterSlides(filter);
 
         });
     };
 
-    $.fn.slickGoTo = function (slide) {
+    $.fn.slickGoTo = function(slide) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.slideHandler(slide);
+            element.slick.slideHandler(slide);
 
         });
     };
 
-    $.fn.slickNext = function () {
+    $.fn.slickNext = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.changeSlide({data: {message: 'next'}});
+            element.slick.changeSlide({
+                data: {
+                    message: 'next'
+                }
+            });
 
         });
     };
 
-    $.fn.slickPause = function () {
+    $.fn.slickPause = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.autoPlayClear();
-           element.slick.paused = true;
+            element.slick.autoPlayClear();
+            element.slick.paused = true;
 
         });
     };
 
-    $.fn.slickPlay = function () {
+    $.fn.slickPlay = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.paused = false;
-           element.slick.autoPlay();
+            element.slick.paused = false;
+            element.slick.autoPlay();
 
         });
     };
 
-    $.fn.slickPrev = function () {
+    $.fn.slickPrev = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.changeSlide({data: {message: 'previous'}});
+            element.slick.changeSlide({
+                data: {
+                    message: 'previous'
+                }
+            });
 
         });
     };
 
-    $.fn.slickRemove = function (slideIndex, removeBefore) {
+    $.fn.slickRemove = function(slideIndex, removeBefore) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.removeSlide(slideIndex, removeBefore);
+            element.slick.removeSlide(slideIndex, removeBefore);
 
         });
     };
 
-    $.fn.slickSetOption = function (option, value, refresh) {
+    $.fn.slickSetOption = function(option, value, refresh) {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-        element.slick.options[option] = value;
+            element.slick.options[option] = value;
 
-        if(refresh === true) {
-            element.slick.unload();
-            element.slick.reinit();
-        }
+            if (refresh === true) {
+                element.slick.unload();
+                element.slick.reinit();
+            }
 
         });
     };
 
-    $.fn.slickUnfilter = function () {
+    $.fn.slickUnfilter = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
-           element.slick.unfilterSlides();
+            element.slick.unfilterSlides();
 
         });
     };
 
-    $.fn.unslick = function () {
+    $.fn.unslick = function() {
         var _ = this;
-        return _.each(function (index, element) {
+        return _.each(function(index, element) {
 
             element.slick.destroy();