Текстовый ротатор показывает весь список на долю секунды, затем начинает работать

#jquery #wordpress #caching #css-animations

#jquery #wordpress #кэширование #css-анимация

Вопрос:

У меня есть текстовый ротатор для героя, и он работает должным образом, но когда я очищаю кеш и загружаю страницу, все слова, которые должны вращаться, отображаются на крошечную секунду, а затем ротатор начинает работать. Я не уверен, как это предотвратить. Я создал скрипку, и скрипка не отображает весь список, но сайт разработчика, над которым я работаю, показывает. Я думаю, что это может быть плагин кэширования…это отложенная загрузка, но я не уверен, как настроить это для бесперебойной работы.

  $(".rotate").rotator();
 

https://jsfiddle.net/EdgarAlexPoe/mhjrdy0n/4/

Ответ №1:

Я не знаком с конкретной библиотекой, но то, что вам нужно, может быть таким же простым, как добавление

 .rotate-arena li {
  display: none;
}
 

для CSS. Казалось, все работало нормально, когда я добавил его в ваш JSFIDDLE.

Что касается того, почему он отображается на сайте разработчика, а не на фрагменте, может быть связано с тем, что сайт разработчика должен загружать элементы и скрипты x, y и z, прежде чем он попадет в JS, в то время как фрагмент попадает прямо в точку.

Комментарии:

1. Правильно. Я использую WP rocket для объединения и минимизации всего js / css. Я отключил его, но это было немного неудобно при загрузке. Я попытаюсь скрыть li и посмотреть, сработает ли это. Спасибо.

2. Да, это было простое решение. Я думал, что спрятал элементы, но в SASS у меня были дочерние элементы, вложенные в h3. Дох! спасибо за вашу помощь @CK MacLeod

3. С удовольствием — добро пожаловать