SVGeezy : n'ayez plus peur d'utiliser le SVG dans vos sites Web

Le , par FirePrawn, Expert éminent sénior
Le SVG est de plus en plus utilisé à l'instar des classiques JPEG et autres PNG.
La raison est simple : la qualité de l'image reste la même quelle que soit sa résolution.
Un bonheur pour tous les graphistes Web ! Malheureusement les vieux navigateurs ne supportent pas ce format récent.
C'est à ce niveau qu'intervient SVGeezy !

Ce plugin JavaScript offre un fallback pour les images SVG dans le cas de vieux navigateurs incompatibles.
SVGeezy est simpliste : il détecte les navigateurs ne supportant pas le format SVG et dans ce cas remplace votre image par un .png (ou un autre format que vous aurez défini).
Deux possibilités d'utilisation :
Code : Sélectionner tout
svgeezy.init('nocheck', 'png'); // le plugin ne doit pas s'appliquer sur les éléments ayant la classe nocheck
ou
Code : Sélectionner tout
svgeezy.init(false, 'png'); // le plugin va vérifier toutes les images
Il y a deux paramètres dans l'appel au plugin :
  • le premier qui peut être soit false soit une classe CSS. Si une classe est renseignée le plugin ne s'appliquera pas sur les éléments ayant cette classe ; sinon il vérifiera toutes les images ;
  • le second paramètre est l'extension de fichier qui viendra remplacer votre SVG. Assurez-vous que votre fichier existe bien : /images/logo.svg sera remplacé par /images/logo.png.


Pour plus d'informations je vous invite à consulter la source sur GitHub.

Télécharger SVGeezy.

Source : benhowdle.im

Et vous ?

Utilisez-vous le SVG pour vos images ?
Si oui vous êtes-vous déjà préoccupé de la compatibilité avec les vieux navigateurs ?


Vous avez aimé cette actualité ? Alors partagez-la avec vos amis en cliquant sur les boutons ci-dessous :


 Poster une réponse

Avatar de Lorenzo77 Lorenzo77 - Membre expérimenté https://www.developpez.com
le 14/05/2013 à 15:06
interessant

si on a besoin d'interactions ou d'animations, ya cette super lib -> https://code.google.com/p/svgweb/
meme principe que svgeezy :
elle remplace automatiquement (par rapport au navigateur) la balise SVG par un SWF si celui ci ne peut pas gerer correctement le SVG et surtout va réussir a generer le SWF par rapport aux commandes du SVG tout en gardant les interactions/animations ... extra !

les tests sont ici : http://codinginparadise.org/projects...rceflash=false
Offres d'emploi IT
Ingénieur développement fpga (traitement vidéo) H/F
Safran - Ile de France - 100 rue de Paris 91300 MASSY
Spécialiste systèmes informatiques qualité et référent procédure H/F
Safran - Ile de France - Colombes (92700)
Chef projet big data - pse flotte H/F
Safran - Ile de France - Évry (91090)

Voir plus d'offres Voir la carte des offres IT
Responsable bénévole de la rubrique JavaScript : Xavier Lecomte -