11548 sujets

JavaScript, DOM et API Web HTML5

Scroller javascript avec curseurs

Bonjour,

Je dois faire un scroller vertical en javascript contenant des images.
Jusque là tout va bien j'ai réussi a faire un scroller avec les curseurs en dehors du bloc ou se trouvent les images. Les curseurs permettent de remonter et de descendre avec une fonction function moveup() et function movedown().
le problème c'est que je dois afficher les boutons en fonction du contenu du div avec les images. Si on arrive en bas du scroll avec les images le curseur "down" doit disparaitre et vice-versa.
Mon scroll fonctionne par groupe de 5 images avec des ancres <a name>
Quand je clique sur le curseur il doit renvoyer aux 5 images suivantes.. Quelqu'un a une idée de comment je dois-faire ??? je suis largué ! merci à vous
voici mon code :
<script language="javascript">
 
var Timer;
var Pas = 3;
  
function moveLayer(Sens)
    {
    if(document.getElementById)
    Objet = document.getElementById("Contenu");
  else
   Objet = document.all["Contenu"];
   if(parseInt(Objet.style.top) + (Pas*Sens) > 0)
  Objet.style.top = "0px";
   else
   Objet.style.top = (parseInt(Objet.style.top) + (Pas*Sens)) + "px";
   Timer = setTimeout("moveLayer(" + Sens + ");", 50);
   }
   </script> 

<body>
   <div id="Support" style="position:relative;width:187;height:500px;overflow:hidden;border:1px solid #000000">
      <div id="Contenu" style="position:absolute;width:187;height:150px;left:0;top:0">
Bla blabla
Bla blabla
Bla blabla
Bla blabla
</div>
   </div>
   <a href="" onmouseover="javascript:moveLayer(1);" onmouseout="javascript:clearTimeout(Timer);">Haut</a>
  <a href="" onmouseover="javascript:moveLayer(-1);" onmouseout="javascript:clearTimeout(Timer);">Bas</a>


J'aimerais que "haut" et "bas" s'affiche en fonction du contenu et que ce soit des curseurs flèches qui s'affichent avec possibilité de passer au contenu suivant. Donc plusieurs div avec différentes news textes...
Donne un id à chacun de tes liens haut et bas (id="haut", id="bas", par exemple), et avec la même méthode que tu as déjà utilisée pour ton "Objet", tu récupère la visibilité via le getElementById, et tu fais un test "if else" sur : 
haut.style.display = "none" ;

Tu peux peut-être d'ailleurs utiliser pour le haut l'id du div "Support", du genre si "Objet.style.top" est égal à "Support.style.top", alors je masque id="haut".
Sujet clos
Aller à