IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

EDI, CMS, Outils, Scripts et API PHP Discussion :

creation de slider


Sujet :

EDI, CMS, Outils, Scripts et API PHP

  1. #1
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut creation de slider
    Bonjour à tous,

    Je sollicite votre aide, votre savoir.
    Je suis bloquer sur un slide, je voudrais inclure les boutons avant arriére pause est de mettre 1 photos a la fois.
    Voici le code :
    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
    <DOCTYPE! html>
    <head>
            <link rel="stylesheet" type="text/css" href="style.css">
            <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
     <!--Script JQuery du Slider-->
    <script type="text/javascript">
       $(function(){
          setInterval(function(){
             $(".slideshow ul").animate({marginLeft:-350},800,function(){
                $(this).css({marginLeft:0}).find("li:last").after($(this).find("li:first"));
             })
          }, 3500);
       });
    </script><!-- Fin du Script -->
    </head>
    <body>
        <!-- Récuperer toute les images du dossier courant avec un  ".jpg"--><!-- Essayer d'afficher toutes les images dans le slider -->
        <div class='slideshow'>   
     
                                   <ul>
     
                                       <?php
     
                                       $types = '*.{gif,jpg,jpeg,png}';
     
                                        foreach (glob($types , GLOB_BRACE) as $filename) { ?>
     
                                           <li>
     
                                               <img src="<?= $filename; ?>">
     
                                           </li>
     
                                       <?php }?>
     
                                   </ul>
     
                               </div
    </body>
     
    </html>
    Si quelqu'un pourrais m'aider cela serai super sympas.
    Car voici ce que cela donne sur le site : xxxxxxxxxxxxxxxxxxxxxxxxx

    Merci par avance.
    @+ Filou

  2. #2
    Membre émérite
    Avatar de badaze
    Homme Profil pro
    Chef de projets info
    Inscrit en
    Septembre 2002
    Messages
    1 412
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Ain (Rhône Alpes)

    Informations professionnelles :
    Activité : Chef de projets info
    Secteur : Transports

    Informations forums :
    Inscription : Septembre 2002
    Messages : 1 412
    Points : 2 522
    Points
    2 522
    Par défaut
    Euh. T’as pas moins crade comme site d’exemple ?
    Cela ne sert à rien d'optimiser quelque chose qui ne fonctionne pas.

    Mon site : www.emmella.fr

    Je recherche le manuel de l'Olivetti Logos 80B.

  3. #3
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    Bonjour

    Désolé des photos si elles sont "bizarres" ou si elles vous ont choqué.

  4. #4
    Invité
    Invité(e)
    Par défaut
    Bonjour,

    1- J'ai supprimé le lien vers ton "site"...
    Si des images pornos sont simplement "bizarres" pour toi, il faut te faire soigner.

    2- Il existe des tas de scripts de sliders, BIEN documentés.
    Si le tien ne donne pas le résultat voulu, cherche-en un autre.

  5. #5
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    Bonjour

    Non je ne suis pas malade, je rigole.
    C'était pour répondre à Badaze je sais pas si c'est le code qui est crade ou les images ou les deux ?

    J'ai trouver des scripts mais le soucis il faut mettre image par image et non inclure un dossier complet car le dossier dans le quel sont les photos va s'alimenter en allant et je ne veux pas toujours remettre des lignes de code.

    Je suis preneur si vous auriez des liens utiles.

    Merci encore pour vos réponses.

    @+ Filou

  6. #6
    Invité
    Invité(e)
    Par défaut
    1- Tu as montré que tu savais récupérer les images dans un dossier en PHP.
    Très bien.

    2- Maintenant, il s'agit juste d'écrire la bonne structure HTML pour les afficher.
    Et ça, ça doit être indiqué dans la DOCUMENTATION du slider (jQuery ?) que tu utilises.

    Par exemple :



    N.B. On ne dit pas "...si vous auriez...", mais "...si vous aviez...".

    (à moins d'une nouvelle réforme de l'orthographe, auquel cas tu pourrais écrire "...si vou orié...").

  7. #7
    Membre émérite
    Avatar de badaze
    Homme Profil pro
    Chef de projets info
    Inscrit en
    Septembre 2002
    Messages
    1 412
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Ain (Rhône Alpes)

    Informations professionnelles :
    Activité : Chef de projets info
    Secteur : Transports

    Informations forums :
    Inscription : Septembre 2002
    Messages : 1 412
    Points : 2 522
    Points
    2 522
    Par défaut
    Citation Envoyé par filou80 Voir le message
    Bonjour

    Non je ne suis pas malade, je rigole.
    C'était pour répondre à Badaze je sais pas si c'est le code qui est crade ou les images ou les deux ?
    En venant sur ce forum je ne m’attends à tomber sur un monsieur-madame qui montre sa teubé quand je clique sur un lien.
    Cela ne sert à rien d'optimiser quelque chose qui ne fonctionne pas.

    Mon site : www.emmella.fr

    Je recherche le manuel de l'Olivetti Logos 80B.

  8. #8
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    Je reviens vers vous encore.
    J'ai trouver le script qu'il me faut, mais celui-ci fonctionne sans vraiment fonctionner, est il possible de me dire ce qu'il ne va pas :

    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
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
    115
    116
    117
    118
    119
    120
    121
    122
    123
    124
    125
    126
    127
    128
    129
    130
    131
    132
    <?php
       //nom du répertoire contenant les images à afficher
       $nom_repertoire = "images";
     
       // extensions acceptées
       $extensions_ok = array("jpg","gif","png","jpeg", "JPG", "GIF", "PNG", "JPEG"); 
     
       //on ouvre le repertoire
       $dossier = opendir($nom_repertoire);
       $i = 0;
     
    	$photos = array();
     
       //on les stocke les noms de fichiers images dans un tableau
       while ($fichier = readdir($dossier))
       {     
       if(in_array(strtolower(substr($fichier, -3)),$extensions_ok)) $photos[] = $fichier;
     
       }
     
       //on ferme le répertoire
       closedir($dossier);
     
       //on peut trier le tableau par ordre alphabétique:
       // array_multisort($photos, SORT_ASC);
     
    $count_photos = count($photos);
     
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Untitled Document</title>
    <script type="text/javascript" >
    <!--
    var rotate_delay = 4000; // delais en microseconde (4000 = 4 secs)
    current = 0;
     
    function lessdelay() {
      if (rotate_delay <= 1000) {
    	rotate_delay = rotate_delay-100; 
    	document.slideform.delay.value = rotate_delay; 
      }else {
    	rotate_delay = rotate_delay-500; 
    	document.slideform.delay.value = rotate_delay; 
      }
    }
     
    function moredelay() {
      if (rotate_delay < 1000) {
    	rotate_delay = rotate_delay+100; 
    	document.slideform.delay.value = rotate_delay; 
      }else {
    	rotate_delay = rotate_delay+500; 
    	document.slideform.delay.value = rotate_delay; 
      }
    }
     
    function next() {
      if (document.slideform.slide[current+1]) {
    	document.images.show.src = document.slideform.slide[current+1].value;
    	document.slideform.slide.selectedIndex = ++current;
      }else first();
    }
     
    function previous() {
      if (current-1 >= 0) {
    	document.images.show.src = document.slideform.slide[current-1].value;
    	document.slideform.slide.selectedIndex = --current;
      }else last();
    }
     
    function first() {
      current = 0;
      document.images.show.src = document.slideform.slide[0].value;
      document.slideform.slide.selectedIndex = 0;
    }
     
    function last() {
      current = document.slideform.slide.length-1;
      document.images.show.src = document.slideform.slide[current].value;
      document.slideform.slide.selectedIndex = current;
    }
     
    function ap(text) {
    document.slideform.slidebutton.value = (text == "Stop") ? " > " : "Stop";
    rotate();
    }
    function change() {
      current = document.slideform.slide.selectedIndex;
      document.images.show.src = document.slideform.slide[current].value;
    }
     
    function rotate() {
      if (document.slideform.slidebutton.value == "Stop") {
    	current = (current == document.slideform.slide.length-1) ? 0 : current+1;
    	document.images.show.src = document.slideform.slide[current].value;
    	document.slideform.slide.selectedIndex = current;
    	window.setTimeout("rotate()", rotate_delay);
      }
    }
    -->
    </script>
    </head>
     
    <body>
     <form name="slideform" action="" id="slideform" style="margin:0px">
    <table width="100%" >
      <tr>    
    <td nowrap="nowrap">
    <b>Il y a <?php echo $count_photos; ?></b> Photo<?php echo (($count_photos>1)? "s": ""); ?> 
    <select name="slide" onchange="change();">
    <?php
    for($i=0; $i < count($photos); $i++) echo "<option value=\"".$photos[$i]."\" ".(($i==0)? "selected=\"selected\"" : ""). ">- ".($i+1)." -</option>";
    ?>
    </select>
    </td>
    <td nowrap="nowrap" align="right">
      <input type="button" onclick="previous();" value="«" title="Précédente" />
      <input type="button"  onclick="ap(this.value);" name="slidebutton" value=" > " title="Défilement Automatique" />
      <input type="button" onclick="next();" value="»" title="Suivante" /></td>
      </tr></table>
      </form>
     
    <table width="100%" >
    <tr><td colspan="2" align="center" width="100%">
    <img alt="" src="<?php echo $photos['0']; ?>" id="show" />
    </td>
    </tr>
    </table>
    </body>
    </html>
    Le soucis c'est que cela dit bien le bon nombre d'image dans le dossier mais les images n'apparaissent pas pourtant elles sont en jpeg, j'ai bien une image qui apparait mais elle se trouve dans la racine du site ?
    Merci par avance pour votre aide.

    @+ Filou

  9. #9
    Invité
    Invité(e)
    Par défaut
    1- Quel script ?

    2- Je t'ai fourni le lien vers un slider fonctionnel, et simple.
    Pourquoi en utiliser un autre ?

    3- Ton code PHP pour parcourir ton dossier images fonctionnait dans ton 1er message.

    Donc :
    • soit tu l'as modifié (Pourquoi... ?),
    • soit, effectivement ton script Js de slider ne fonctionne pas


    4- strtolower(substr($fichier, -3)) : ce n'est pas comme ça qu'on trouve une extension (surtout que là, tu ne risques pas de trouver "jpeg" !)
    Remplace par :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    strtolower(pathinfo($fichier,PATHINFO_EXTENSION))

  10. #10
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    Bonsoir

    J'ai regarder slick mais il faut valider chaque image que moi je veux juste un script qui prend le répertoire complet.
    J'ai remplacer ce que vous m'avez dit mais cela ne fonctionne pas.
    Voici ma page de test : xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

    @+ Filou

  11. #11
    Invité
    Invité(e)
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    <div class="mon-slider-slick">
    <?php
    $types = '*.{gif,jpg,jpeg,png}';
    foreach (glob($types , GLOB_BRACE) as $filename) { ?>
        <div>
          <img src="<?= $filename; ?>">
        </div>
    <?php }?>
    </div>
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    $(document).ready(function(){
      $('.mon-slider-slick').slick({
      });
    });
    Dernière modification par Invité ; 11/11/2018 à 18h24.

  12. #12
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    Les images apparaissent les unes en dessous des autres.
    voici mon test : xxxxxxxxxxxxxxxxxxxxxxxxxxx
    Le premier code je l'ai mis dans une page php et le deuxieme code en page css ou j'ai attacher la feuille css a la page php

    Merci de votre aide et du temps passé.

    @+ Filou

  13. #13
    Invité
    Invité(e)
    Par défaut
    Il manque les fichiers (JS / CSS) pour que slick fonctionne.


    Je t'ai mis un lien : CLIQUE DESSUS !

  14. #14
    Membre du Club
    Homme Profil pro
    Inscrit en
    Mars 2013
    Messages
    152
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Mars 2013
    Messages : 152
    Points : 57
    Points
    57
    Par défaut
    J'ai rajouter les 2 fichiers cela me donne ceci : xxxxxxxxxxxxxxxxxxx

Discussions similaires

  1. besoins d'aide creation de requete
    Par jameson dans le forum SQL
    Réponses: 9
    Dernier message: 20/03/2008, 13h45
  2. (aide) creation de fichier Setup
    Par kashomi dans le forum VB.NET
    Réponses: 6
    Dernier message: 07/01/2008, 22h23
  3. AIDE :: Creation d"un VPN
    Par Razielone dans le forum C
    Réponses: 0
    Dernier message: 18/11/2007, 12h08
  4. [Conception] Aide creation formulaire
    Par benhur44 dans le forum PHP & Base de données
    Réponses: 2
    Dernier message: 10/10/2007, 17h35
  5. [javascript] creation de slide barre
    Par meniou12 dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 16/08/2005, 14h00

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