Disable FOUC on Oxygen Slider Element

Arshad
9 Aug 2022

The Oxygen slider element shows all slides once in a flash on page load then go correct styling. This is called FOUC (Flash Of Unstyled Content).

If you are facing the same issue, here is the solution. Just follow steps.

  1. Copy your slider element ID in somewhere like notepad and add an extra class to the slider like “ar-hide”
  2. Set the Display Property to none for this, via Advanced Layout.
  3. Now create a code-block in your page or template, go to PHP/HTML section and comment the middle line by putting // (two obliques/slashes) before the text.
  4. Go to JS section and put the code : (Replace the #slider-2-22 to the ID of the slider you copied in step 1.
  5. The problem is solved.
jQuery('#slider-2-22').removeClass('ar-hide');

Was this article helpful?

Tags

Categories

Never miss new post again

Subscribe and get list of new posts in your inbox

Click to Copy