Défilement d'image dynamique Javascript
Sombresonge
-
Sombresonge Messages postés 108 Statut Membre -
Sombresonge Messages postés 108 Statut Membre -
Bonjour,
Je cherche actuellement a créer un défilement dynamique d'image au survol de la souris sur une zone.
Mon problème vient du SetTimeout qui ne semble pas fonctionner. Au survol de la souris, le décalage se fait une seule fois, alors qu'il devrait tourner en boucle tant que la souris survole la zone.
Merci d'avance pour vos réponses
Je cherche actuellement a créer un défilement dynamique d'image au survol de la souris sur une zone.
Mon problème vient du SetTimeout qui ne semble pas fonctionner. Au survol de la souris, le décalage se fait une seule fois, alors qu'il devrait tourner en boucle tant que la souris survole la zone.
//Fichier JS
timerID = null;
function ScrollHorizontal(obj,speed) {
if(obj.offsetLeft<=0 && obj.offsetLeft+speed <=0) {
obj.style.left = obj.offsetLeft+speed+"px";
}
timerID = setTimeout("ScrollHorizontal("+obj+","+speed+")",30);
}
function ScrollStop() {
clearTimeout(timerID);
}
//Fichier PHP
<img src="images/btn_before.gif" onmouseover="ScrollHorizontal(document.getElementById('bloctomove'),8);" onmouseout="ScrollStop();" />
<div id="cont" style="height:250px; width:665px; position:relative; overflow:hidden;">
<div id="bloctomove" style="position:absolute; width:5000px;">
// toutes mes images ici
</div>
</div>
<img src="images/btn_after.gif" onmouseover="ScrollHorizontal(document.getElementById('bloctomove'),-8);" onmouseout="ScrollStop();" />
Merci d'avance pour vos réponses
A voir également:
- Défilement d'image dynamique Javascript
- Tableau croisé dynamique - Guide
- Barre de défilement - Guide
- Image iso - Guide
- Exemple tableau croisé dynamique télécharger - Télécharger - Tableur
- Liste déroulante dynamique excel - Guide
4 réponses
Bonsoir,
ce n'est pas dynamique mais interactif. Du contenu dynamique est en rapport avec une base de données et sera modifié sans avoir à modifié le site.
Pour le problème de setTimeout renseignez vous sur la fonction setInterval.
ce n'est pas dynamique mais interactif. Du contenu dynamique est en rapport avec une base de données et sera modifié sans avoir à modifié le site.
Pour le problème de setTimeout renseignez vous sur la fonction setInterval.
Bonsoir,
Le problème de SetInterval, c'est qu'il n'est pas compatible avec tous les navigateurs. SetTimeout devrais fonctionner (d'ailleurs il fonctionne sur d'autres fonctions similaires).
Le problème de SetInterval, c'est qu'il n'est pas compatible avec tous les navigateurs. SetTimeout devrais fonctionner (d'ailleurs il fonctionne sur d'autres fonctions similaires).
J'ai enfin trouvé la solution au problème, il s'agit simplement du paramètre 'obj' qui n'est plus valable au deuxième passage de la fonction (obj étant un DOMelement). J'ai remplacé ce paramètre par un simple ID, ca fonctionne
function ScrollHorizontal(obj_id,speed) {
var obj = document.getElementById(obj_id);
if(obj.offsetLeft<=0 && obj.offsetLeft+speed <=0) {
obj.style.left = obj.offsetLeft+speed+"px";
}
timerID = setTimeout("ScrollHorizontal('"+obj_id+"',"+speed+")",30);
}
<img src="images/btn_after.gif" onmouseover="ScrollHorizontal('bloctomove',-8);" onmouseout="ScrollStop();" />