metafizzy / flickity

:leaves: Touch, responsive, flickable carousels
https://flickity.metafizzy.co
7.52k stars 605 forks source link

Fix problem in old versions Android KitKat 4.4 #851

Closed ivanferrer closed 5 years ago

ivanferrer commented 5 years ago

The problem is that it did not scroll the content because there is no attribute: -webkit-transform:, the solution:

Flickity.prototype.positionSlider = function() {
    var x = this.x;
    // wrap position around
    if ( this.options.wrapAround && this.cells.length > 1 ) {
        x = utils.modulo( x, this.slideableWidth );
        x = x - this.slideableWidth;
        this.shiftWrapCells( x );
    }

    x = x + this.cursorPosition;
    // reverse if right-to-left and using transform
    x = this.options.rightToLeft ? -x : x;
    var value = this.getPositionValue( x );
    // use 3D tranforms for hardware acceleration on iOS
    // but use 2D when settled, for better font-rendering
    this.slider.style.transform = this.isAnimating ?
        'translate3d(' + value + ',0,0)' : 'translateX(' + value + ')';
    this.slider.style['-ms-transform'] = this.isAnimating ?
        'translate3d(' + value + ',0,0)' : 'translateX(' + value + ')';
    this.slider.style['-webkit-transform'] = this.isAnimating ?
        'translate3d(' + value + ',0,0)' : 'translateX(' + value + ')';

    // scroll event
    var firstSlide = this.slides[0];
    if ( firstSlide ) {
        var positionX = -this.x - firstSlide.target;
        var progress = positionX / this.slidesWidth;
        this.dispatchEvent( 'scroll', null, [ progress, positionX ] );
    }
};
desandro commented 5 years ago

Flickity dropped support for Android 4 in v2.1.1. You can use v2.1.0 for Android 4 support

hvaughan3 commented 5 years ago

For anyone else who runs into this, downgrading to 2.1.0 causes a unidragger dependency library related error to appear. In order to fix that, downgrade unidragger to 2.2.3.