• ACCUEIL
  • blogger

    DEFILEMENT : SLIDER avec balise "marquee"

    DEFILEMENT DE PHOTOS
    (FAUX)  SLIDER ultra simplifié

    SLIDER ?
    Un slider est un module intégré  à un blog ou une page web  qui permet le défilement de plusieurs images ("slides").. Le slider se trouve soit sur la page d’accueil en dessous de la barre du menu ("bannière"), soit dans un article comme illustration, soit comme moyen de présentation de photos ("diaporama". Il peut être composé de 2, 3, 4 ou plus d’images qui s’affichent les unes après les autres. Le slider est aussi appelé "carrousel"
    Ce module est plus ou moins complexe  à utiliser et configurer  (code en mode HML) selon son graphisme et ses possibilités techniques

    On peut aussi faire défiler des images d'une manière très simple en utilisant  le code indiqué (en mode HTML) de la balise "marquee" en principe destinée au texte défilant...

    C'est la manière la plus simple d'affichage de diaporama. 
    Dans ce blog sont également proposés des sliders classiques, sélectionnés pour leur facilité d'utilisation, sans intervention  dans le CSS : le code forme un seul bloc à intégrer dans un article  ou un gadget HTML.

    TUTORIEL
    Pour un défilement de droite à gauche par défaut :
    • Principe de base avec  1 image, le CODE :
      <marquee><img src="url de l'image"> </marquee>
    • Possible avec 2 images ou plus, le CODE :
        <marquee><img src="url de l'image"><img src="url de l'image"> </marquee>
    • Remarque pour espacer les images insérer entre chaque le "code" espace:    &nbsp;
    • Cette balise "marquee" est en principe obsolète mais fonctionne toujours!
    • Dans notre exemple les photos sont stockées dans Drive : nous utilisons le code suivant pour faire le lien           <img src="https://drive.google.com/uc?id=identifiant" />
      (voir partie  3 de cet article)
    • On peut ajouter des "attributs" voir ICI ou LA ou 3wdocs qui permettent quelques configurations spécifiques (direction, couleur, taille, marge, délai...)



    DEMO ( avec 8  photos, sans code espace et sans aucun attribut spécifique)