> Tous les forums > Forum des Webmasters
 HTML : insérer une image conditionnelle
Ajouter un message à la discussion
Page : [1] 
Page 1 sur 1
system32
  Posté le 11/03/2017 @ 17:00 
Aller en bas de la page 
Petit astucien

Bonjour à tous !

J’ai une image sur un site en construction et je cherche à insérer une toute autre image en deçà d’une largeur de périphérique de 720px...

J’ai cherché à faire quelque chose avec srcset mais apparemment c’est plutôt pour choisir une image en fonction de la résolution d’écran, non?

Actuellement j’utilise une double image avec un système de media queries et de display:none, mais même si le rendu est bon, chaque périphérique en télécharge deux.

Est-ce que quelqu’un connaîtrait un moyen d’utiliser srcest en fonction de la largeur d’écran, comme en CSS avec les media queries ?

Ça me serait de grande aide, merci d’avance !



Modifié par system32 le 11/03/2017 18:46
Publicité
zoulouman
 Posté le 22/03/2017 à 12:19 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Personne pour répondre ici ? Bon allez, c'est parti ! Même si je découvre ce srcset...

Salut,

En espérant que depuis le temps, ton souci est réglé.

De ce que j'ai vu ici :

https://www.alsacreations.com/article/lire/1621-responsive-images-srcset.html

IE ne prend pas en charge srcset (à la limite, c'est pas très grave), mais le pire est qu'il est souvent "partiellement supporté" par les autres ! (si quelqu'un comprend ce "partiellement", j'attends vos lanternes)

Je crois qu'il va te falloir attendre un peu que ce petit nouveau srcset soit pris en charge par tous, et continuer à jouer avec les media queries en attendant.

C'est vrai que les media queries sont pénibles parce que toutes les images sont chargées. Pour un mobile, c'est vraiment pas l'idéal. Et pour peu qu'un visiteur utilisant un vieux navigateur arrive, il se retrouve avec les images mobile et desktop affichées ! Résultats garantis !

Ceci dit, je vais suivre ce srcset de très prêt, il a l'air bien intéressant. J'ai pas vraiment tout compris en survolant l'article, la syntaxe est étrange, mais on va se pencher dessus.

Page : [1] 
Page 1 sur 1

Vous devez être connecté pour participer à la discussion.
Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !
Recevoir PC Astuces par e-mail


La Lettre quotidienne +226 000 inscrits
Avec l'actu, des logiciels, des applis, des astuces, des bons plans, ...

Les bonnes affaires
Une fois par semaine, un récap des meilleurs offres.

Les fonds d'écran
De jolies photos pour personnaliser votre bureau. Une fois par semaine.

Les nouveaux Bons Plans
Des notifications pour ne pas rater les bons plans publiés sur le site.

Les bons plans du moment PC Astuces

Tous les Bons Plans
149,90 €Processeur AMD Ryzen 5 5500 à 149,90 €
Valable jusqu'au 23 Mai

RueDuCommerce fait une promotion sur le processeur AMD Ryzen 5 5500 qui passe à 159,90 € alors qu'on le trouve ailleurs à partir de 185 €. 

Le processeur pour PC de bureau AMD Ryzen 5 5500 propose 6 coeurs natifs et 12 coeurs logiques pour un traitement multitâche agréablement fluide. Grâce à sa fréquence native élevée 3.6 GHz et à son mode Turbo Core ajustant la puissance en fonction des besoins (jusqu'à 4.2 GHz), le CPU AMD Ryzen de nouvelle génération délivre des performances exceptionnelles dans tous les domaines : Jeux vidéo, multitâche intensif, édition vidéo, modélisation 3D et bien plus encore. Le cache L3 de 16 Mo permet en outre le traitement ultrarapide d'un grand nombre d'instructions grâce à des latences réduites. Fourni avec un système de refroidissement.


> Voir l'offre
189,99 €Mini PC MeLE PCG35 (Celeron J4125, 8Go RAM, 128 SSD, Windows 10 Pro) à 189,99 €
Valable jusqu'au 23 Mai

Amazon fait une vente flash sur le mini PC MeLE PCG35 à 189,99 € au lieu de 219,99 € grâce à un coupon à activer sur la page du produit. La livraison est gratuite. Ce mini PC au format NUC d'Intel possède un processeur Intel Celeron J4125 4 coeurs avec chip graphique Intel UHD 600, 8 Go de RAM DDR4 et un SSD de 128 Go. Il dispose d'une connectique complète : un emplacement M.2 libre pour ajouter un SSD supplémentaire jusqu'à 4 To, un emplacement SATA 2.5 pouces pour ajouter un disque dur supplémentaire, le WiFi, le bluetooth, 4 ports USB 3.0, 2 ports HDMI 2.0 qui supportent jusqu'à la 4K, un port Ethernet Gigabit et tourne sous Windows 10 Pro (que vous pouvez mettre à jour pour Windows 11). Il est entièrement silencieux puisqu'il bénéficie d'une conception sans ventilateur et d'un refroidissement naturel. 

Branchez ce mini PC sur une TV (support VESA fourni) ou un écran et vous avez un ordinateur discret et performant pour Internet, de la bureautique et regarder des films.


> Voir l'offre
95,98 €SSD Interne M.2 NVMe Samsung 980 1 To (3500 Mo/s) à 95,98 €
Valable jusqu'au 23 Mai

Amazon fait une promotion sur le SSD Interne M.2 NVMe PCIe 3.0 Samsung 980 1 To qui passe à 95,98 €. On le trouve ailleurs à partir de 120 €. Ce SSD offre des taux de transfert de 3500 Mo/s. Une bonne affaire.


> Voir l'offre

Sujets relatifs
Code HTML pour image qui s'adapte
Insérer une bannière image dans header de piwigo ?
comment insérer une image d'une capture écran
Inserer une image au survol d'un texte
insérer du code html dans un article blogger
Insérer une application flash dans une image
probleme avec image html
Insérer son quand on passe la souris sur une image
Image en fond > html et css
Insérer plusieurs portraits sur une même image
Plus de sujets relatifs à HTML : insérer une image conditionnelle
 > Tous les forums > Forum Forum des Webmasters