Изменение srcset в Firefox мерцает изображение после перехода - PullRequest
0 голосов
/ 25 апреля 2018

У меня есть два <img> -элемента, где первое изображение должно исчезнуть, а второе изображение исчезнет.Когда переход заканчивается, я удаляю класс для постепенного исчезновения и переключаю источники изображения тегов.

<img id="in" class="in" [srcset]="inSrcSet" (transitionend)="transitionEndIn($event)">
<img id="out" class="out" [srcset]="outSrcSet" (transitionend)="transitionEndOut($event)">

в компоненте, который я переключаю, srcset

// sample 
transitionEndIn(event){
   this.inSrcSet = "outSrcSet";
}
 transitionEndOut(event){
   this.outSrcSet = "inSrcSet";
}

Это изменение в srcset заставляет изображение мерцать в Firefox.Похоже, что затухающее изображение возвращается к полной непрозрачности на долю секунды.Однако я не вижу мерцания, если использую обычный src вместо srcset.

Я сделал Stackblitz , иллюстрирующий мою проблему.Я сделал пример с src и srcset, чтобы вы могли увидеть разницу.Проблема не возникает в Chrome, хотя.(Я не тестировал другие веб-браузеры).Появление / исчезновение не является циклом, поэтому вы должны обновить Stackblitz, чтобы увидеть переход снова.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...