Nouveau #plugin #SPIP : medias_responsive
▻http://zone.spip.org/trac/spip-zone/browser/_plugins_/medias_responsive#squelettes/modeles
Ça complète mon plugin image_responsive. J’avais en effet deux problèmes à résoudre :
– Mon précédent plugin permet de gérer les images responsive, mais les raccourcis <doc> et <img> de SPIP ne les exploitaient pas.
– Les raccourcis sont truffés de dimensions « en dur », du coup non seulement les images ne sont pas « responsives », mais tout ça a tendance à péter les maquettes responsive.
Ce nouveau raccourci introduit donc plusieurs éléments (c’est work in progress, hein) :
– ces raccourcis (appels inchangés) utilisent donc |image_responsive, et si je ne me trompe pas, en utilisant le lazy_load de mon plugin (si c’est pas le cas, faudra que je corrige) ;
– les images sont insérées en utilisant les tags <figure> et <figcaption> du HTML5 ;
– il y a un javascript qui calcule la largeur de la colonne contenant les éléments, qui a pour intérêt principal de sucrer les float right et left quand la largeur de la colonne de texte devient trop faible par rapport au bloc image. Donc sur très petit écran, on n’a plus cet effet de float désastreux avec le texte qui n’a plus que 20 pixels pour « habiller » une image ; là l’image est centrée et basta.
J’aurais bien aimé me débarrasser complètement des dimensions insérées « en dur » dans le code, mais comme les images à l’intérieur sont elles-même en responsive, donc de dimensions a priori inconnues, si je ne force pas les valeurs je me retrouve avec des images de 0 pixels de large.
