Хорошо, что мне здесь не хватает ...
Я пытаюсь заставить тег изображения начинаться с "маленького" изображения шириной 250 пикселей, а затем заставляю браузер выбирать наиболее подходящее изображение на основе по атрибутам srcset и sizes - так что, вы знаете, «нормально».
Что происходит
src - единственное, что используется . Будь то superawesomeimagename 250.jpg или superawesomeimagename 1000.jpg - он не изменяет / не загружает другое изображение.
Сам тег HTML
<img
class="img-left"
data-sizes="250,500,750,1000,1250"
style="width:869px;max-height:580px;"
sizes="(min-width: 869px) 72vw, 100vw"
srcset="
/img/superawesomeimagename 250.jpg 250w,
/img/superawesomeimagename 500.jpg 500w,
/img/superawesomeimagename 750.jpg 750w,
/img/superawesomeimagename 1000.jpg 1000w,
/img/superawesomeimagename 1250.jpg 1250w
"
src="/img/superawesomeimagename_250.jpg"
alt="Image Alt Description"
>
(Отформатировано для вашего удобства)
Я пробовал
- ставить
src первым (что, я не думал, будет иметь значение, но ничего остальное сработало) - перемещение атрибутов ширины / высоты, установленных TinyMCE, в стиль
- полное удаление стилей
- полное удаление
sizes (почему бы и нет)
Дополнительная информация
data-sizes есть только для того, что я / планировал - Не то чтобы это важно, но все включено одна строка
- 869px и 72vw являются формулами c на основе их представления дизайна в TinyMCE и ожидаемого просмотра администратором во всю ширину.
Есть ли у кого-нибудь какие-либо идеи? Заранее спасибо! :)