ganlanyuan / tiny-slider

Vanilla javascript slider for all purposes.
MIT License
5.26k stars 785 forks source link

responsive breaks autoHeight #573

Open St-Permiakov opened 4 years ago

St-Permiakov commented 4 years ago

Issue description:
Using responsive and autoHeight options at the same time causes 2 bugs. 1) Height animation disappears. Responsive autoHeight changes height in a blink, no fancy animations applied. 2) If disable and reenable autoHeight (after window resize, if disabled for mobile and enabled for desktop) calculations break and some slides for some reason stop affecting slider height. Demo link/slider setting: I think I will be able to provide demo a little later, settings for now:

{
            container: document.querySelector('.js-slider-container'),
            items: 3,
            slideBy: 1,
            speed: 400,
            autoplayButtonOutput: false,
            mouseDrag: false,
            lazyload: !/rv:11.0/i.test(navigator.userAgent), // bugfix IE11
            arrowKeys: true,
            nav: true,
            navPosition: 'bottom',
            preventScrollOnTouch: 'auto', // bugfix warning console on touch
            autoHeight: false,
            controls: false,
            rewind: true,
            responsive: { // <-- that's the core of the problem, without it — all good
                1024: {
                    autoHeight: true,
                },
            },
}

Tiny-slider version: 2.9.2 Browser name && version: Chrome, 81.0.4044.113 OS name && version: Windows 10

jorgepcbraz commented 3 years ago

I have exactly the same problem. Any news on this?