JavaScript / Scrollbar
Fermé
Yaninho
Messages postés
484
Date d'inscription
jeudi 19 mars 2009
Statut
Membre
Dernière intervention
30 août 2010
-
29 avril 2009 à 09:17
Vigli Messages postés 166 Date d'inscription mercredi 5 décembre 2007 Statut Membre Dernière intervention 5 juillet 2010 - 29 avril 2009 à 11:42
Vigli Messages postés 166 Date d'inscription mercredi 5 décembre 2007 Statut Membre Dernière intervention 5 juillet 2010 - 29 avril 2009 à 11:42
A voir également:
- JavaScript / Scrollbar
- Telecharger javascript - Télécharger - Langages
- Node.js javascript runtime virus ✓ - Forum Virus
- Javascript echo ✓ - Forum PHP
- Erreur #125 javascript - Forum Mozilla Firefox
- Table de multiplication javascript ✓ - Forum Javascript
1 réponse
Vigli
Messages postés
166
Date d'inscription
mercredi 5 décembre 2007
Statut
Membre
Dernière intervention
5 juillet 2010
26
29 avril 2009 à 11:42
29 avril 2009 à 11:42
Bonjour, et bien si c'est un travail que tu as a faire, ne te le fait pas faire par quelqu'un d'autre ou ne reprends pas un travail déja fait, moi je dis ça car, rien de mieux pour apprendre que de faire par soit-même.
Sinon tu peut, sans entrer dans les détails demandés, t'inspirer de ça:
(Pour faire varier la vitesse de défilement il suffit de modifier la valeur de la variable “Pas” )
Le principe est simple il suffit de placer 2 div le premier est celui qui délimitera la zone d'affichage. Le second est le contenu à faire défiler. Nous rajoutons un troisième div qui contiendra les bouton de défilement, vous pouvez le positioner ou vous voulez cela n'a aucune importance.
Vous pouvez placer les style dans une feuille de style à part celui définissant la position top du div “contenu” afin que javascript puisse avoir accès à cette valeur.
Sinon tu peut, sans entrer dans les détails demandés, t'inspirer de ça:
<script language="javascript" type="text/javascript">
var Timer;
var Pas = 3;
function moveLayer(Sens) {
Objet=document.getElementById("contenu");
if(parseInt(Objet.style.top) + (Pas*Sens)>0) {
clearTimeout(Timer);
}
else if(parseInt(Objet.style.top) + (Pas*Sens)<-(Objet.offsetHeight-document.getElementById("support").offsetHeight)) {
clearTimeout(Timer);
}
else {
Objet.style.top = (parseInt(Objet.style.top) + (Pas*Sens)) + "px";
}
Timer = setTimeout("moveLayer(" + Sens + ");", 30);
}
</script>
(Pour faire varier la vitesse de défilement il suffit de modifier la valeur de la variable “Pas” )
Le principe est simple il suffit de placer 2 div le premier est celui qui délimitera la zone d'affichage. Le second est le contenu à faire défiler. Nous rajoutons un troisième div qui contiendra les bouton de défilement, vous pouvez le positioner ou vous voulez cela n'a aucune importance.
<div id="support" style="position:relative; width:150px; height:280px; overflow:hidden; border:1px solid #000;"> <div id="contenu" style="position:absolute; top:0;"> DEBUT<br />ligne1<br />ligne2<br />ligne3<br />ligne4<br />ligne5<br />ligne6<br /> ligne7<br />ligne8<br />ligne9<br />ligne10<br />ligne11<br />ligne12<br />ligne13<br /> ligne14<br />ligne15<br />ligne16<br />ligne17<br />ligne18<br />ligne19<br />FIN<br /> </div> <div style="background-color:#0F0; width:22px; height:280px; position:absolute; right:0; border-left:1px solid #000;"> <img onmouseover="moveLayer(1);" onmouseout="clearTimeout(Timer);" src="slideup.png" style="cursor:pointer; position:absolute; right:0;" alt="" /> <img onmouseover="moveLayer(-1);" onmouseout="clearTimeout(Timer);" src="slidedown.png" style="cursor:pointer; position:absolute; right:0; bottom:0;" alt="" /> </div> </div>
Vous pouvez placer les style dans une feuille de style à part celui définissant la position top du div “contenu” afin que javascript puisse avoir accès à cette valeur.
