Идея данного вопроса возникла по мотивам ответа -
"Позиционирование блока относительно фона"
Эту картинку можно использовать для ответа
В том ответе удалось поместить статичную картинку на экран TV и сделать её адаптивной.
Но хочется большей реалистичности, то есть сделать картинку живой, с анимацией смены изображений на экране TV.
Вопрос, как сделать это.
Понятно, что нужно, подложить под экран TV слайдер с картинками. И маской или clipPath
вырезать область подобную экрану TV. Перепробовал несколько вариантов решения с масками, но ни один не сработал.
Допустимо применение любой техники для реализации анимации и адаптивности приложения: svg
, css
, javascript
или все техники вместе.
Решение должно быть адаптивно и работать во всех современных браузерах, кроме IE, так как он не дружит с анимацией по определению.
Это учебный вопрос-пример, но он дополнительно имеет и практическое применение. Допускается любое количество ответов, все будут отмечены.