Holder.js, une librairie d’images par défaut côté client

Holder fourni des images par défaut directement côté client. Pouvant fonctionner en ligne et hors ligne, ce script offre une API permettant de créer des styles d’images personnalisés.

holder-js-client-side-image-placeholders

Holder utilise l’élément canvas et les Data URI scheme afin de produire le rendu de l’image par défaut directement dans le navigateur.

L’avantage de ce script est de rendre l’utilisateur totalement autonome pour la production de wireframes HTML et de prototypes d’applications Web. Il ne dépend plus d’un service tiers d’images par défaut.

Comment utiliser Holder.js

Vous devez appeler le script :

<script src="holder.js"></script>

Lorsque vous souhaitez utiliser une image par défaut, spécifiez-le directement dans l’attribut source de vos balises <img> comme ceci :

<img src="holder.js/200x300">

200 est la largeur de l’image et 300 sa hauteur.

Holder autorise l’insertion de textes dans l’image générée. L’apparence de cette dernière telle que la couleur de l’arrière-plan et du texte peut être contrôlée en ajoutant au script vos paramètres personnalisés.

Pour plus de détails :

Accueil : http://imsky.github.com/holder/

Docs : https://github.com/imsky/holder/blob/master/README.md

GitHub : https://github.com/imsky/holder

Les navigateurs supportés sont :

  • Chrome 1+
  • Firefox 3+
  • Safari 4+
  • Internet Explorer 9+, avec un support dégradé pour IE6-8
  • Android 1+
Par Guillaume Palayer Un chasseur-cueilleur et un curieux avant tout des dernières avancées du monde des Internets. Fondateur du Magazine du Webdesign, un blog-cerveau à propulsion humaine, ayant pour mission de faire le tri dans le bruit du Web afin de proposer les meilleurs contenus à la communauté du Magazine du Webdesign.

Inscrivez-vous à la newsletter du Magazine du Webdesign

Inscrivez-vous à notre newsletter afin de recevoir chaque mois une sélection des meilleurs articles et ressources.

Commentaires (2)

  1. Ping : Holder.js, une librairie d’images par défaut côté client | Webdesign et développement Web | Scoop.it

  2. Ping : Holder.js, une librairie d’images par défaut côté client | Webdesign et magie des Internets | Scoop.it

Laisser un commentaire

Yep, vous souhaitez poster un commentaire... complétez les trois champs ci-dessous. Pas de spams, protégeons les Internets.

*

You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

↑ Haut de page