Как в слайдере slick поменять картинку на мобильном устройстве?

Question

[wizzzart]

В слайдере kenwheeler.github.io/slick есть опция responsive для адаптивного поведения. У меня в слайдере изображения в горизонтальной ориентации. Можно ли как-то для ширины, скажем, меньше 800px поменять картинку на вертикальную?

Answer 1

[iBird Rose]

как вариант суешь ссылки картинок в data атрибут. а потом на js меняешь их на src картинок. и не забудь сделать реинит slick слайдера.

Answer 2

[zenwarr]

Еще есть тег picture, который позволяет с помощью тега source указывать разные изображения для разных медиа-запросов с помощью примерно вот такого синтаксиса:

<picture>
    <source src="med.jpg" media="(min-width: 40em)" />
    <source src="sm.jpg" />
    <img src="fallback.jpg" alt="" />
</picture>

Правда, поддержка у него не идеальная. caniuse.com/#feat=picture