Un plugin jQuery pour faire des colonnes dynamiques : Wookmark jQuery plugin

Un des effets que l’on voit de plus en plus en ce moment est l’effet de colonnes dynamiques. Cela permet un affichage avec des belles colonnes, qui suivent une grille et qui s’adaptent en fonction de la taille de l’écran.

C’est ce design qu’a choisi le site web Wookmark qui permet de « bookmarker » des images (à l’instar de Pinterest, qui utilise aussi cette mise en page). Les éditeurs du site ont eu la bonne idée de faire un plugin jQuery qui permet de reproduire la mise en page utilisée sur le site internet.

Le plugin est très simple à utiliser : il n’y a que 3 options, mais qui permettent de configurer efficacement le plugin (sachant qu’ils sont tous optionnels) :

  • container : la taille du conteneur pour les colonnes (par défaut il utilise la totalité de la page)
  • offset : pour régler l’espace entre les items
  • itemWidth : pour régler la largeur d’un item

À noter que pour un affichage plus sympa, il vaut mieux que toutes les images soient de la même taille (si tu affiches des images). Et cerise sur le gâteau, cela fonctionne parfaitement sur Smartphone ! Pour conclure, ce plugin jQuery peut être utile pour faire toutes sortes de galeries photos ou autres portfolios.

Ce contenu a été publié dans JQuery, avec comme mot(s)-clé(s) , , , . Vous pouvez le mettre en favoris avec ce permalien.

3 reponses a Un plugin jQuery pour faire des colonnes dynamiques : Wookmark jQuery plugin

  1. Kaori dit :

    Comme je ne vois pas le lien vers le plugin ni dans l’article, ni sur wookmark, le voici ^^

    http://www.wookmark.com/jquery-plugin

  2. arnaud dit :

    Woops ! Merci de l’avoir remarqué, je viens de l’ajouter 😉

  3. Ping : Infographie sur les médailles françaises au Jeux Olympiques | JQuery, PHP, html, design… // arnaud-k : un blog de geek

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *