image-magnify ~ voir les détails d'une photo

Un effet de loupe pour voir les détails d'une photo

➠ image_magnify : affiche un effet de loupe sur une image

Cliquer pour lire la documentation

syntaxe {up image-magnify=image | imgzoom=image-pour-zoom}
author LOMART version 1.0 license GNU/GPLv3 credit thdoan
  • image_magnify: fichier image normale
  • imgzoom: fichier image utilisé pour le zoom. si vide: image principale
  • size: diametre de la loupe en pixel
  • radius: diametre de la loupe en pixel
  • border: modele de bordure pour la loupe
  • class: classe(s) ajoutées au bloc principal
  • style: style inline ajouté au bloc principal

    Un simple exemple

    Avec ce simple shortcode, on obtient ce résultat :

    {up image-magnify=images/photos/Basilique-Saint-Pierre-Vatican-mini.jpg 
      | imgzoom=images/photos/Basilique-Saint-Pierre-Vatican.jpg}

    Survoler l'image avec votre curseur pour voir l'effet

    Encore plus simple

    Version 1.8 on indique uniquement le chemin vers la grande photo

    {up image-magnify=images/photos/Basilique-Saint-Pierre-Vatican.jpg}

    Cette méthode présente plusieurs avantages :

    • chargement d'une seule image
    • inutile de créer et d'indiquer dans le shortcode 2 versions de l'images
    • la petite image aura toujours une bonne qualité quelque soit sa taille affichée

    Avec quelques paramètres

    {up 
      image-magnify = images/photos/Kenya-Cheetah-Masai-Mara-nb-mini.jpg
      | imgzoom = images/photos/Kenya-Cheetah-Masai-Mara.jpg
      | size=200
      | radius=30%
      | border=fin
    }
    

    size est la taille de la loupe, radius son arrondi et border, le style de la loupe

    Nous utilisons l'option imgzoom pour  la grande image en couleur et image-magnify pour sa version en noir et blanc.

    Survoler l'image avec votre curseur pour voir l'effet

    version 1.8

    • Si l'option imgzoom n'est pas renseignée, l'action utilisera l'image de l'option principale image-magnify.
    • filter : exécute l'action dans certaines conditions. Voir la documentation