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

Développement Web en Java Discussion :

Diaporama effet retournement (bouton retour)


Sujet :

Développement Web en Java

  1. #1
    Candidat au Club
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    2
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 2
    Points : 2
    Points
    2
    Par défaut Diaporama effet retournement (bouton retour)
    Bonjour bonjour! J'ai trouvé un script assez sympatique pour un diaporama avec effet de retournement des images.

    <script language="javascript">
    var largDepart = 0
    var hautDepart = 0
    var numImg = 0
    var timerRe = 0
    var timerAg = 0
    var vitesse = 50
    var tabImage = new Array()
    tabImage[0] = "images/10.jpg"
    tabImage[1] = "images/13.jpg"
    tabImage[2] = "images/1.jpg"
    tabImage[3] = "images/2.jpg"
    tabImage[4] = "images/3.jpg"
    tabImage[5] = "images/11.jpg"
    tabImage[6] = "images/4.jpg"
    tabImage[7] = "images/5.jpg"
    tabImage[8] = "images/6.jpg"
    tabImage[9] = "images/12.jpg"
    tabImage[10] = "images/7.jpg"
    tabImage[11] = "images/8.jpg"
    tabImage[12] = "images/9.jpg"
    tabImage[13] = "images/14.jpg"


    var tabDesc = new Array()
    tabDesc[0] = "Description Cathedrale"


    function init(obj) {
    obj.src = tabImage[numImg]
    obj.alt = tabDesc[numImg]
    largDepart = obj.width
    hautDepart = obj.height
    if (vitesse > largDepart) { vitesse = largDepart }
    }

    function changeImage(obj) {
    if (timerAg != 0) {
    clearTimeout(timerAg)
    timerAg = 0
    }
    if (timerRe == 0) { timerRe = setTimeout("retrecirImage("+obj.name+")",0) }
    }

    function agrandirImage(obj) {
    if (obj.width < largDepart) {
    if (obj.width+vitesse > largDepart) { obj.width = largDepart }
    else { obj.width += vitesse }

    obj.height = hautDepart
    timerAg = setTimeout("agrandirImage("+obj.name+")",0)
    }
    else {
    clearTimeout(timerAg)
    timerAg = 0
    }
    }

    function retrecirImage(obj) {
    if (obj.width > 0) {
    obj.width -= vitesse
    obj.height = hautDepart
    timerRe = setTimeout("retrecirImage("+obj.name+")",0)
    }
    else {
    clearTimeout(timerRe)
    timerRe = 0
    obj.src = tabImage[(numImg+1)%tabImage.length]
    obj.alt = tabDesc[(numImg+1)%tabImage.length]
    numImg++
    timerAg = setTimeout("agrandirImage("+obj.name+")",0)
    }
    }
    </script>
    <BR>
    <DIV align="center"><img name="image" onclick="changeImage(image)">
    <BR>Cliquez sur l'image pour voir la suivante</DIV>
    <script language="javascript">
    init(image)
    </script>



    Mais y'a quelques modifications que j'aurais voulu lui apporter, sans y parvenir.
    Donc si quelqu'un pouvait m'aider, ce serait vraiment très gentil!

    J'aurais aimé créer un bouton pour qu'on puisse également revenir en arrière sur les images du diaporama, comme par exemple dans ce code-là :

    <script type="text/javascript">
    ejs_photo = new Array;
    <?
    $a = 0;
    $handle = opendir("18ansfanny");
    while (($file = readdir())!=false) {
    clearstatcache();
    if($file!=".." && $file!=".")
    {
    echo "ejs_photo[$a] = '18ansfanny/$file';
    ";
    $a++;
    }
    }
    closedir($handle);
    ?>
    function ejs_aff_18ansfanny(num)
    {
    if(document.getElementById)
    {
    ejs_fin = "";
    if(num!=0)
    ejs_fin += "<A HREF=# onClick='ejs_aff_18ansfanny("+(num-1)+");return(false)'>< Précédent</A> ";
    if(num!=(ejs_photo.length-1))
    ejs_fin += "<A HREF=# onClick='ejs_aff_18ansfanny("+(num+1)+");return(false)'>Suivant ></A>";
    document.getElementById("ejs_photo_box").innerHTML = "<CENTER><IMG SRC='"+ejs_photo[num]+"' STYLE='border: 2px solid #000000'><BR>"+ejs_fin+"</CENTER>";
    }
    }
    window.onload = new Function("ejs_aff_18ansfanny(0)")

    </script>


    (code d'un script pour un autre diaporama, mais sans effet de retournement)
    Je n'ai pas réussi à l'intégrer dans le code...

    Merci de votre aide!

  2. #2
    Modérateur
    Avatar de dinobogan
    Homme Profil pro
    ingénieur
    Inscrit en
    Juin 2007
    Messages
    4 073
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 42
    Localisation : France

    Informations professionnelles :
    Activité : ingénieur
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2007
    Messages : 4 073
    Points : 7 163
    Points
    7 163
    Par défaut
    Tu n'auras pas d'aide ici car tu n'es pas dans le bon forum. Javascript n'a aucun rapport avec Java.
    Mais tu es pardonné car l'erreur est souvent commise par les débutants
    N'oubliez pas de consulter les FAQ Java et les cours et tutoriels Java
    Que la force de la puissance soit avec le courage de ta sagesse.

  3. #3
    Membre éclairé Avatar de zorm
    Profil pro
    Inscrit en
    Décembre 2004
    Messages
    584
    Détails du profil
    Informations personnelles :
    Localisation : France, Loire Atlantique (Pays de la Loire)

    Informations forums :
    Inscription : Décembre 2004
    Messages : 584
    Points : 672
    Points
    672
    Par défaut
    Bonjour,

    La remarque de dinobogan est pertinente, il est clair que tu t'es trompé de forum. Maintenant, pour t'aider quand même dans ton problème, je te propose d'essayer ce petit bout de code qui permettra de résoudre ton problème...

    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
     
    <html>
        <head>
            <title>Test</title>
            <script language="javascript">
                var largDepart = 0
                var hautDepart = 0
                var numImg = 0
                var timerRe = 0
                var timerAg = 0
                var vitesse = 50
                var tabImage = new Array()
                tabImage[0] = "images/1.jpg"
                tabImage[1] = "images/2.jpg"
                tabImage[2] = "images/3.jpg"
                tabImage[3] = "images/4.jpg"
     
     
                var tabDesc = new Array()
                tabDesc[0] = "Description Cathedrale"
     
     
                function init(obj){
                    obj.src = tabImage[numImg]
                    obj.alt = tabDesc[numImg]
                    largDepart = obj.width
                    hautDepart = obj.height
                    if (vitesse > largDepart) {
                        vitesse = largDepart
                    }
                }
     
                function changeImage(obj, sens){
                    if (timerAg != 0) {
                        clearTimeout(timerAg)
                        timerAg = 0
                    }
                    if (timerRe == 0) {
                        timerRe = setTimeout("retrecirImage(" + obj.name + "," + sens + ")", 0)
                    }
                }
     
                function agrandirImage(obj){
                    if (obj.width < largDepart) {
                        if (obj.width + vitesse > largDepart) {
                            obj.width = largDepart
                        }
                        else {
                            obj.width += vitesse
                        }
     
                        obj.height = hautDepart
                        timerAg = setTimeout("agrandirImage(" + obj.name + ")", 0)
                    }
                    else {
                        clearTimeout(timerAg)
                        timerAg = 0
                    }
                }
     
                function retrecirImage(obj, sens){
                    if (obj.width > 0) {
                        obj.width -= vitesse
                        obj.height = hautDepart
                        timerRe = setTimeout("retrecirImage(" + obj.name + "," + sens + ")", 0)
                    }
                    else {
                        clearTimeout(timerRe)
                        timerRe = 0
                        if (numImg == 0) 
                            numImg = tabImage.length;
                        obj.src = tabImage[(numImg + sens) % tabImage.length]
                        obj.alt = tabDesc[(numImg + sens) % tabImage.length]
                        numImg += sens
                        timerAg = setTimeout("agrandirImage(" + obj.name + ")", 0)
                    }
                }
            </script>
        </head>
        <body onload="init(image)">
            <div align="center">
                <img name="image">
            </div>
            <a href="#" onclick="changeImage(image,-1)">precedent</a>
            <a href="#" onclick="changeImage(image,1)">suivant</a>
        </body>
    </html>
    Par contre, si je peux te donner un conseil, plutôt que vouloir retravailler un code javascript comme ça, cherche un peu plus pour voir si tu pourrais pas trouver une solution déjà faite, il y en a plein.
    Surtout du côté des framework genre JQuery, prototype...

  4. #4
    Candidat au Club
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    2
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Novembre 2004
    Messages : 2
    Points : 2
    Points
    2
    Par défaut
    Merci beaucoup en tout cas! Je vais essayer ça!

Discussions similaires

  1. bouton retour
    Par joe206 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 12/05/2006, 16h33
  2. [Mail] Couleur de l'echo et bouton retour
    Par joe206 dans le forum Langage
    Réponses: 4
    Dernier message: 09/05/2006, 09h48
  3. Réponses: 8
    Dernier message: 24/04/2006, 14h00
  4. [FLASH] Bouton retour
    Par rhums dans le forum Flash
    Réponses: 4
    Dernier message: 09/03/2006, 16h32
  5. Désactivé le bouton retour.
    Par glanumf dans le forum ASP
    Réponses: 3
    Dernier message: 31/05/2005, 17h25

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