Discussion: Défilement de photos

  1. #1
    Membre habitué Avatar de solorac
    Inscrit en
    avril 2007
    Messages
    477
    Détails du profil
    Informations personnelles :
    Âge : 47

    Informations forums :
    Inscription : avril 2007
    Messages : 477
    Points : 136
    Points
    136

    Par défaut Défilement de photos

    Bonsoir la Communauté,

    Je viens de me créer une galerie de photos simple en utilisant des tutos et je voudrais ajouter deux boutons pour les faire défiler.

    Je sais que ma galerie utlise du html et du js mais aussi du css.

    Le but c'est au départ de choisir une mini-photo et ensuite à partir de ce positionnement de faire défiler à droite ou gauche en cliquant sur un bouton basique ou image (que je ferai).

    Malgré mes recherches sur les forums et sur google je ne trouve rien de convaincant.

    Pourriez-vous m'aider ?

    Voici mon html :

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    <div id="galerie">
      <ul id="galerie_mini">
        <li>
          <a href='../../images/N2!/convention/8686.jpg'><img src="../../images/N2!/convention/8686b.jpg"/></a>    </li>
        <li>
          <a href='../../images/N2!/convention/8687.jpg'><img src="../../images/N2!/convention/8687b.jpg"/></a>    </li>
        <li>
          <a href='../../images/N2!/convention/8689.jpg'><img src="../../images/N2!/convention/8689b.jpg"/></a>    </li>
        <li>
          <a href='../../images/N2!/convention/8686.jpg'><img src="../../images/N2!/convention/8686b.jpg"/></a>    </li>
        <li></ul>
     
      <dl id="photo">
        <dt>Convention N! 2017</dt>
        <dd><img id="big_pict" src="images/photo1.png"/></dd>
      </dl>
    </div>

    Le css :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    div#galerie
    {
      width: 1250px ;
      background: #EB6F71 ;
      border: 1px solid #dcb ;
      padding: 15px ;
      margin:auto;
      text-align: center ;
      font: 0.9em Georgia, serif ;
    }
     
    ul#galerie_mini
    {
      margin: 0 ;
      padding: 0 ;
      list-style-type: none ;
    }
     
    ul#galerie_mini li
    {
      float: left ;
    }
     
    ul#galerie_mini li a img
    {
      margin: 2px 1px ;
      border: 1px solid #dcb ;
    }
     
    dl#photo
    {
      clear: both ;
      margin: 0 auto ;
    }
     
    dl#photo dt
    {
      font: italic 2.5em/1.5em Georgia, serif ;
      color: #dcb ;
    }
     
    dl#photo dd
    {
      margin: 0 ;
    }
     
    dl#photo img
    {
      border: 1px solid #dcb ;
    }
    Merci pour votre aide.

  2. #2
    Membre expérimenté Avatar de vttman
    Homme Profil pro
    Développeur COBOL et le WE (CSS, PHP, JS et MYSQL)
    Inscrit en
    décembre 2002
    Messages
    714
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Moselle (Lorraine)

    Informations professionnelles :
    Activité : Développeur COBOL et le WE (CSS, PHP, JS et MYSQL)
    Secteur : Industrie

    Informations forums :
    Inscription : décembre 2002
    Messages : 714
    Points : 1 344
    Points
    1 344

    Par défaut

    En passant ...
    En ce qui me concerne, basiquement pour rechercher du code et des idées je regarde du coté codepen ...
    donc en tapant "diaporama codepen" sous goo*gle j'ai déjà pas mal d'exemples + code
    et aussi "slideshow codepen" après il suffit de copier/ s'approprier le code qui parait le + clair avec +/- de Javascript
    Je suis sympa comme tout Mosellan mais ...
    ... (m')aider ou (me) mettre sur la voie c'est une chose
    ... tout (me) faire de A à Z, c'est pas ma conception du rôle d'un forum X ou Y
    Si vous n'êtes pas satisfait de mes réponses, n'hésitez pas à me le faire savoir Merci !

  3. #3
    Membre habitué Avatar de solorac
    Inscrit en
    avril 2007
    Messages
    477
    Détails du profil
    Informations personnelles :
    Âge : 47

    Informations forums :
    Inscription : avril 2007
    Messages : 477
    Points : 136
    Points
    136

    Par défaut

    Quelqu'un pourrait-il me mettre sur la voie ?

Discussions similaires

  1. Mise en place d'un défilement de photos
    Par solorac dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 24/07/2010, 15h16
  2. défilement de photo en flash
    Par marsew dans le forum ActionScript 1 & ActionScript 2
    Réponses: 0
    Dernier message: 08/04/2009, 12h25
  3. Défilement de Photos
    Par djamess dans le forum Flash
    Réponses: 1
    Dernier message: 19/01/2009, 17h24
  4. défilement de photos et textes
    Par mawelle dans le forum IHM
    Réponses: 3
    Dernier message: 17/05/2008, 17h20
  5. [MX] Défilement de photos
    Par FredericB dans le forum Flash
    Réponses: 7
    Dernier message: 09/02/2004, 17h58

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo