Блог

Главная - Вопросы по программированию - Как Javascript может обнаружить img-содержимое div, измененное анимацией CSS?

Как Javascript может обнаружить img-содержимое div, измененное анимацией CSS?

#javascript #css

#javascript #css

Вопрос:

Любые предложения о том, как я могу определить, что содержимое img div было изменено с помощью анимации CSS?

Псевдокод:

 HTML
   <div id="banana"></div>

CSS
   #banana {
      content: url("image0.png");
      animation: blink 10s infinite;
   }

   @keyframes blink {
      20% {  content: url("image1.png"); }
      40% {  content: url("image2.png"); }
      60% {  content: url("image3.png"); }
   }

Я пробовал MutationObserver, но, похоже, это не вызывается, когда анимация изменяет изображение.

Я также пробовал addEventListener (‘animationiteration’ …), но это вызывается только один раз в цикле, и CSS заменяет несколько изображений (переменное число с переменным расположением).

На страницах разработчиков Mozilla есть примечание об использовании «content: url (…)» — «Контент, созданный CSS, не включен в DOM».

Означает ли это, что Javascript не может обнаружить эти изменения?

Метки: