Janky Animation on Desktop Safari and all iOS browsers (safari, chrome and Arc)
Hi there, I'm working on a website for a client and they requested a slider on the website, i used splidejs to achieve this but when testing the website after building it i noticed janky animation where the slide just skip to the next one without animating on safari on mac and mobile broswers.
Things to note :
When i added a hardware acceleration code to website root css it fixes this but breaks any element that has position fixed.
Also the janky animation isn't only happening on slide but on some other element too.
Here's a live link: https://chriss-test-ideas-website-a85a52bbc87ce.webflow.io/
Preview link: https://preview.webflow.com/preview/chriss-test-ideas-website-a85a52bbc87ce?utm_medium=preview_link&utm_source=designer&utm_content=chriss-test-ideas-website-a85a52bbc87ce&preview=f258dfde99111bea7242b0e388f141b1&pageId=66668c8e3ecf2a92ab7171b9&locale=en&workflow=preview
Please help!
AI HR SUMMIT 2024 — HR Leaders is a digital media platform Shaping ...
Join the AI HR Summit, an essential learning experience for CHROs exploring the integration of AI in HR, focusing on People Analytics, HR Technology, Future of Work, Generative AI's impact, and Ethics in the digital age. Connect with experts to navigate AI-driven talent strategies, legislative chall
1 Reply
@Adeleke I'm not sure about your implementation but this cloneable is VERY similar to your build and uses Swiperjs.
https://webflow.partnerlinks.io/cloneable-is-bae?sub1=swiper-centered-active-scaled
You could add free-mode to get that effect too.
Swiper - Centered with Active Slide
Swiper - Centered with Active Slide - Webflow
Swiper slider with a scaled up center slide.