Modifier un script de slider

**agatos** · 19/11/2019, 19h25

Bonjour,
Il y a longtemps que je n'était pas venu sur ce forum.
Voila j'ai depuis très longtemp un script en JS qui fait un diaporama.
L'avancement se fait par 2 flèches (affreuses) que j'ai mis en place des deux côtés.
Je voudrai supprimer ces flèches par d'autres plus discrète mais à l’interrieur sur les bords de la photo.
Je pense que ça serai possible en CSS mais je n'y suis jamais arrivé.
Je veux vous montrer mon script mais je ne sais pas si je peux faire un copier coller ou s'il y a des codes à mettre.
Pouvez-vous m'aider.
Merci de votre attention
Cordialement

**danielhagnoul** · 19/11/2019, 19h32

La balise

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

copier-coller votre code ici

est insérée par le bouton # ci-dessus (dans la boite de dialogue)

**agatos** · 19/11/2019, 19h57

Merci de l'aide, voici le script.

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
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
 <?php
   $dir = $_GET['repert'];
   $ptr = opendir($dir);
   while ($fichier = readdir($ptr))
   {
     if (is_file("$dir$fichier") && preg_match("%.jpg%i",$fichier))    // ou .gif éventuellement
     {
      $Diapo[] = $dir.$fichier;
   }
   } 
    sort($Diapo);
 
   $nb = count($Diapo);  // nombre d'images en PHP
 
 ?>
 
 <script style="text/JavaScript">
 
 // ************** d'après un petit script de SVM juin 2002 *********************
         var n = 0;
         var ImgDiapo = new Array();
 
         nb = <?php  echo "$nb;"; ?>  // nb d'images en JavaScript (trouvé par PHP)
 
 
 <?php
    for ($i=0 ; $i<$nb ; $i++)
      {
        echo("\tImgDiapo[$i]=\"$Diapo[$i]\";\r\n") ;
      }
 ?>
 
             var NbrImg = nb-1;  // ou (ImgDiapo.length - 1);
 
             var img = new Array();
 
             for (i=0;i<=NbrImg;i++)
             {
              img[i]= new Image();
              img[i].src=ImgDiapo[i];
             }
 
             function Diapo(d) {
                     n = n + d;
                     if (n < 0) {
                     n = NbrImg;
                     }
                     if (n > NbrImg) {
                     n = 0;
                     }
                     document.MonImage.src = ImgDiapo[n];
             }
 
  </script>
 
 <body onload="document.form1.reset();">
 
 <form name="form1">
<center>
   <table border="0" style="height: 700px;width: 800px;margin: 0;padding: 0;">
   <tr><td>
<a href='Photos_en_vrac' ><img src='photos/retour.png' border='0' alt='' /></a>
    </td></tr>
     <tr> 
          <td>
          <a href='#' onclick='Diapo(-1);return(false);'><img src='photos/precedent.png' border='0' alt='' /></a>
                    <img src="<?php echo "$Diapo[0]"; ?>" name="MonImage" border="2" />
 
          <a href='#' onclick='Diapo(+1);return(false);'><img src='photos/suivant.png' border='0' alt='' /></a>
 
          </td>     
     </tr>
 
   </table>
 
</center>
 </form>
 
 </body>

Invité · 20/11/2019, 10h08

Bonjour,

les scripts PHP et JS n'ont, ici, pas d'importance.
Ce sont les codes HTML et CSS qui comptent.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
     <tr> 
          <td>
          <a href='#' onclick='Diapo(-1);return(false);'><img src='photos/precedent.png' border='0' alt='' /></a>
                    <img src="<?php echo "$Diapo[0]"; ?>" name="MonImage" border="2" />
 
          <a href='#' onclick='Diapo(+1);return(false);'><img src='photos/suivant.png' border='0' alt='' /></a>
 
          </td>     
     </tr>

Peut-on voir le code CSS actuellement appliqué ?
Peut-on voir une page en ligne ?

Sinon, voici une solution (avec le CSS en ligne de code) :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<tr> 
  <td>
    <div style="position:relative;display:inline-block;">
      <a href="#" onclick="Diapo(-1);return(false);"><img style="position:absolute;left:0;top:30%;width:48px;border:0;" src="http://www.icône.com/images/icones/6/0/go-previous-5.png" alt="" /></a>
      <img src="<?php echo $Diapo[0]; ?>" name="MonImage" border="2" />
      <a href="#" onclick="Diapo(+1);return(false);"><img style="position:absolute;right:0;top:30%;width:48px;border:0;" src="http://www.icône.com/images/icones/6/0/go-next-5.png" alt="" /></a>
    </div>
  </td>     
</tr>

N.B. Les 2 icônes sont téléchargeables sur ce site.

Modifier un script de slider

CSS

Discussions similaires

Partager

Partager