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

jQuery Discussion :

Comment faire tourner mon carrousel automatiquement


Sujet :

jQuery

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre régulier
    Homme Profil pro
    Technicien Help Desk
    Inscrit en
    Juillet 2011
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Technicien Help Desk
    Secteur : Service public

    Informations forums :
    Inscription : Juillet 2011
    Messages : 7
    Par défaut Comment faire tourner mon carrousel automatiquement
    Bonjour,

    je suis actuellement en plein développement d'un site web dans lequel il y a un carrousel. Celui-ci fonctionne "presque" parfaitement. (http://www.distrimat.be)

    Le soucis est que je voudrais qu'il tourne tout seul et que lorsque l'on clique sur une image, cela renvois vers une page propre a la photo sur laquelle on a cliqué.

    Un peu comme sur le site http://www.studiomauriks.com/

    La première question est donc est-ce possible avec JQuery ou faut il autre chose ?

    La second est voulez vous bien m'aider ?

    voici mes bouts de code :

    Dans mon fichier banner.php
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <ul class='gallery'>
    <!-- il faut 10 images pour que le carrousel soit joli (min & max) -->
    <li><img src='images/slide1.png' alt='' /></li>
    <li><img src='images/slide3.png' alt='' /></li>
    <li><img src='images/slide5.png' alt='' /></li>
    <li><img src='images/slide4.png' alt='' /></li>
    <li><img src='images/slide6.png' alt='' /></li>
    <li><img src='images/slide1.png' alt='' /></li>
    <li><img src='images/slide3.png' alt='' /></li>
    <li><img src='images/slide4.png' alt='' /></li>
    <li><img src='images/slide5.png' alt='' /></li>
    <li><img src='images/slide6.png' alt='' /></li>
    </ul>
    Pour les variables de fonction j'utilise un fichier script.js
    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
    $(document).ready(
      function() 
      {
        $('ul.gallery').roundabout(
          {
            shape: 'square', 
            minScale: 0.2,
            minOpacity: 1,
            maxScale: 1,
            duration:1000,
            focusBearing:1,
            debug:false,
            clickToFocus:true
          }
        );
      }
    );
    Et en fin, jQuery Roundabout Shapes que j'ai trouvé sur http://fredhq.com/projects/roundabout-shapes/
    Voici le lien pour que vous ayez le même que moi
    jquery.roundabout-shapes.js

    Voilà,
    j’espère que vous aurez des idées, éventuellement une voie sur laquelle me mettre.

    Merci d'avance.

  2. #2
    Rédacteur

    Avatar de danielhagnoul
    Homme Profil pro
    Étudiant perpétuel
    Inscrit en
    Février 2009
    Messages
    6 389
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant perpétuel
    Secteur : Enseignement

    Informations forums :
    Inscription : Février 2009
    Messages : 6 389
    Billets dans le blog
    125
    Par défaut
    Bonjour

    Le site que vous citez utilise le plugin CloudCarousel : http://www.professorcloud.com/mainsite/carousel.htm

    Ce plugin possède plusieurs options, mais je manque de temps ce matin.

    Blog

    Sans l'analyse et la conception, la programmation est l'art d'ajouter des bogues à un fichier texte vide.
    (Louis Srygley : Without requirements or design, programming is the art of adding bugs to an empty text file.)

  3. #3
    Membre régulier
    Homme Profil pro
    Technicien Help Desk
    Inscrit en
    Juillet 2011
    Messages
    7
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Belgique

    Informations professionnelles :
    Activité : Technicien Help Desk
    Secteur : Service public

    Informations forums :
    Inscription : Juillet 2011
    Messages : 7
    Par défaut
    Super merci j'ai enfin réussi a le faire fonctionner.

    Effectivement il utilise cloud.

Discussions similaires

  1. comment faire tourner une video en boucle sous Firefox?
    Par samsso2006 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 11/04/2007, 12h14
  2. comment faire tourner squid
    Par bazdik dans le forum Applications et environnements graphiques
    Réponses: 1
    Dernier message: 07/03/2007, 10h30
  3. Réponses: 4
    Dernier message: 28/07/2006, 13h10
  4. [VPython] Comment faire tourner un objet Curve ?
    Par aliassaf dans le forum 3D
    Réponses: 2
    Dernier message: 26/07/2006, 00h46
  5. [XSL]Comment faire ceci ?? Mon for-each n'affiche pas tout !
    Par Devil666 dans le forum XSL/XSLT/XPATH
    Réponses: 4
    Dernier message: 27/07/2005, 15h04

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