Hi everybody,
I just made some adjusments for a client, and now the slider I implementend on the ‘voor-consumenten’ page won’t ‘grow’ anymore when it moves in.
I tried to copy paste it from a backup where it worked, but that didn’t do the trick, does somebody know how to fix it?
Here is my site Read-Only: Webflow - Fitwin
The link you provided isn’t executing properly. So sharing some general issues and solutions for debugging.
The most common cause is CSS transforms not being applied correctly to the center slide:
.slick-slide {
transform: scale(0.8);
transition: transform 0.3s ease;
}
.slick-slide.slick-center {
transform: scale(1);
}
Make sure your Slick initialization has the correct settings:
$('.your-slider').slick({
centerMode: true,
centerPadding: '60px',
slidesToShow: 3,
responsive: [
{
breakpoint: 768,
settings: {
arrows: false,
centerMode: true,
centerPadding: '40px',
slidesToShow: 1
}
}
]
});
If you copied from a backup, there might be CSS conflicts. Check if other styles are overriding your center slide styles:
/* Make sure this is specific enough */
.slick-slider .slick-slide.slick-center {
transform: scale(1.1) !important;
}
Wow thanks my friend, the CSS adjustments did the trick, I even fixed the opacity. It works perfect, only one thing. When I go from slide ‘Fit worden loont’ to ‘Kies je activiteit’ the ‘Haal je weekdoel’ slide pops-up first. Is there a way to fix this?
Read-only: Webflow - Fitwin
@MarkSmit
When navigating from the “Fit worden loont” slide (index 5) to “Kies je activiteit” (index 0), the carousel is currently taking the forward path due to infinite scrolling, instead of moving directly backward as expected. To resolve this issue, you can consider one of the following approaches: disable infinite scrolling to prevent looping behavior, implement custom navigation logic to control the slide direction manually, or use centerMode with appropriate settings to manage the navigation flow more accurately.
