@Jussss92

Почему gsap не меняет изображение?

Привет.
Я использую vue3-carousel и мне надо сделать изображения по эффекту fade. Чтобы просто оно менялось без анимации.
Так как в данной библиотеке этого свойства нет я использую библиотеку gsap.
У меня есть блок
<div id="communication-img" >
        <img loading="lazy" src="/img/chat.png"/>
      </div>

Для смены изображения я делаю так.
const img = document.querySelector("#communication-img");     
 gsap
    .timeline({
       scrollTrigger: {
         trigger: img,
         pin: img,
       }
     })
     .to(img, {
       attr:{src:"/assets/img/communication/chat1.png"}
     })

Потом я планировал передать это в scrolltriger, чтобы анимация началась когда доходишь до блока. Так вот не пойму, что я делаю не так.
  • Вопрос задан
  • 42 просмотра
Пригласить эксперта
Ответы на вопрос 1
Lapita12
@Lapita12
Тесты, тесты?
const img = document.querySelector("#communication-img");

gsap
  .timeline({
    scrollTrigger: {
      trigger: img,
      pin: img,
    },
  })
  .to(img, {
    set: {
      src: "/assets/img/communication/chat1.png",
    },
  });
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы