kenwheeler / slick

the last carousel you'll ever need
kenwheeler.github.io/slick
MIT License
28.49k stars 5.89k forks source link

Slider content enlarged when page is loaded for a split second #4284

Open fabianschultz opened 9 months ago

fabianschultz commented 9 months ago

short description of the bug / issue, provide more detail below.

========================================

Hi, I was looking for a slider option and the slick slider is really awesome! I only have one slight issue:

I use the slider in a sidebar widget and when the page loads, each time for a split second the content inside is enlarged before it jumps to the normal size.

I want to display user avatars and they are shown (horizontally aligned) according tot he height dimensions set in CSS. However, when teh page is loaded/refreshed the first displayed user avatars grow out of proportion, pushing down the widget container and others below.

How can I prevent the initial (split second) enlarging of content/objects?

============================

============================

Things I tried tried are set max-height for widget/container/slider. It stops the other widgets to be pushed down further, yes. But inside the widget where I use slick slider still the user avatars are enlarged for a split second before they shrink/jump to the size they are supposed to be.

============================

============================

Do I need to use time delay for loading the slick slider content?

============================

chimok commented 8 months ago

@fabianschultz This slider is not awesome and maybe never was? Its a over 10 years old piece of javascript with no future updates depending on jquery.

You could try to show only the first slide until the plugin is initialized.

.gallery > .slide:not(:first-child) {
    display: none;
}