Bonjour à tous. 
J'ai 2 images : une version desktop, une version mobile.
Je souhaiterais que l'image desktop soit remplacée par l'image mobile lorsque le viewport width passe en dessous de 480px, au même titre que le ferait la CSS suivante avec des background-images :
Je pensais pouvoir faire l'opération coté HTML avec l'attribut srcset :
Mais ça ne fonctionne pas, il me met tout le temps l'image mobile, et la redimensionne au resize du viewport, or je souhaite que les 2 images restent à leur taille d'origine respective.
Ai-je zappé un détail ? Ou n'est-ce tout simplement pas possible ainsi ?
Merci d'avance pour vos réponses.
J'ai 2 images : une version desktop, une version mobile.
Je souhaiterais que l'image desktop soit remplacée par l'image mobile lorsque le viewport width passe en dessous de 480px, au même titre que le ferait la CSS suivante avec des background-images :
.logo{ background-image:url(http://placehold.it/400x200&text=desktop); }
@media screen and (max-width:480px) {
.logo{ background-image:url(http://placehold.it/300x150&text=mobile); }
}Je pensais pouvoir faire l'opération coté HTML avec l'attribut srcset :
<img src="http://placehold.it/400x200&text=desktop" alt="" srcset="http://placehold.it/300x150&text=mobile 480w">Mais ça ne fonctionne pas, il me met tout le temps l'image mobile, et la redimensionne au resize du viewport, or je souhaite que les 2 images restent à leur taille d'origine respective.
Ai-je zappé un détail ? Ou n'est-ce tout simplement pas possible ainsi ?
Merci d'avance pour vos réponses.