Did you manage to fix the flickering issue in Safari when using the FullPage.js plugin with Horizontal Scroll extension?

Published on
September 22, 2023

To fix the flickering issue in Safari when using the FullPage.js plugin with the Horizontal Scroll extension in Webflow, here are a few steps you can take:

  1. Check for conflicting interactions: Sometimes, interactions within Webflow can cause conflicts with external plugins. Inspect your interactions and modify or remove any that may be conflicting with the Horizontal Scroll extension. To do this, go to the "Interactions" panel in the Webflow Designer and review your interactions.

  2. Optimize images: Large or unoptimized images can cause performance issues and flickering. Make sure to compress and optimize your images before uploading them to your Webflow project. This will help improve loading times and reduce flickering.

  3. Disable unnecessary animations: Consider disabling or reducing the number of animations on your page. Multiple animations can strain the performance of the page, leading to flickering issues. Instead, focus on using smooth transitions and subtle effects.

  4. Update the FullPage.js plugin and Horizontal Scroll extension: Ensure that you are running the latest versions of both the FullPage.js plugin and the Horizontal Scroll extension in your Webflow project. Developers often release updates to resolve bugs and improve compatibility, which may include fixes for flickering issues.

  5. Use custom CSS to address the issue: If the flickering issue persists, you can try using custom CSS to override any conflicting styles or adjust the behavior of the FullPage.js plugin or Horizontal Scroll extension. For example, you might need to modify the z-index values of elements or adjust positioning properties to ensure smooth scrolling.

Remember to test your changes in different browsers, including Safari, to ensure that the flickering issue is resolved. If the problem persists, you may want to reach out to the Webflow support team or seek assistance from the Webflow community for further troubleshooting.

Additional Questions:

  1. How do I optimize images in Webflow to improve performance?
  2. What are some common conflicts with Webflow interactions and external plugins?
  3. How do I update plugins and extensions in Webflow?