HTML : insérer une image différente selon le support
Résolu
Caetera
Messages postés
234
Date d'inscription
Statut
Membre
Dernière intervention
-
Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention -
Caetera Messages postés 234 Date d'inscription Statut Membre Dernière intervention -
Bonjour à toutes et à tous,
Je débute en codage
Pour les besoins d'un site internet j'aimerais insérer une image dans une page,
Je connais le tag <img> cependant j'aimerais que l'image diffère (2 images différentes) selon la version du site consultée (desktop ou mobile)
Est-ce possible ? Savez-vous comment faire ?
Je débute en codage
Pour les besoins d'un site internet j'aimerais insérer une image dans une page,
Je connais le tag <img> cependant j'aimerais que l'image diffère (2 images différentes) selon la version du site consultée (desktop ou mobile)
Est-ce possible ? Savez-vous comment faire ?
A voir également:
- HTML : insérer une image différente selon le support
- Editeur html - Télécharger - HTML
- Espace html ✓ - Forum HTML
- [**] Balise pour un espace vide en hml. Merci ✓ - Forum Webmastering
- /Var/www/html/index.html ✓ - Forum Linux / Unix
- Html download - Télécharger - HTML
2 réponses
Bonjour,
Soit en utilisant du PHP... soit en utilisant du JAVASCRIPT
Dans les deux cas, un simple IF/ELSE en fonction du site consulté te permettra de faire ce que tu veux.
Mais sans savoir comment tu as géré tes "deux" versions de site... nous ne pourrons pas t'en dire plus
Soit en utilisant du PHP... soit en utilisant du JAVASCRIPT
Dans les deux cas, un simple IF/ELSE en fonction du site consulté te permettra de faire ce que tu veux.
Mais sans savoir comment tu as géré tes "deux" versions de site... nous ne pourrons pas t'en dire plus
Comment je peux savoir comment squarespace gère les 2 versions du site ?
J'ai essayé ce code ci avec IF/ELSE :
Mais sans succès, , c'est peut-être trop simpliste ?
Je ne sais pas comment déterminer la condition initiale,
Dans l'idéal j'aimerais que la page détermine si l'utilisateur/trice utilise un mobile,
Si oui : image mobile
Si non : image desktop
J'ai essayé ce code ci avec IF/ELSE :
<img if(navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)
)
{
src="image mobile"
}
else {
src="Image desktop"
}
>
Mais sans succès, , c'est peut-être trop simpliste ?
Je ne sais pas comment déterminer la condition initiale,
Dans l'idéal j'aimerais que la page détermine si l'utilisateur/trice utilise un mobile,
Si oui : image mobile
Si non : image desktop
Alors..... le Javascript.. ça ne se place pas comme ça n'importe comment dans une page....
Il faut les mettre dans des balises <script>
Dans ton cas ça ressemblerait d'avantage à
Il faut les mettre dans des balises <script>
Dans ton cas ça ressemblerait d'avantage à
<img id="toto" src="Image desktop"/>
<script type="text/javascript">
var monimage = document.getElementById('toto');
if( navigator.userAgent.match(/iPhone/i)
|| navigator.userAgent.match(/webOS/i)
|| navigator.userAgent.match(/Android/i)
|| navigator.userAgent.match(/iPad/i)
|| navigator.userAgent.match(/iPod/i)
|| navigator.userAgent.match(/BlackBerry/i)
|| navigator.userAgent.match(/Windows Phone/i)
){
monimage.src="image mobile";
} else {
monimage.src="Image desktop";
}
</script>
J'utilise spacequare mais la plateforme ne me permet de faire ce que je voudrais, alors j'utilise l'option qui m'est laissée, c'est-à-dire, injecter mon propre code