[scrollBy()] defilement bloqueet/ou boucle infinie [Résolu]

Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
- - Dernière réponse : Bul3
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
- 21 août 2009 à 11:13
Bonjour,

J'essai de faire défiler une page avec la fonction scrollBy() lorsque la souris s'approche des bords de la fenêtre.

En utilisant simplement cette fonction, appelée par un "onmouseover" sur une balise div, je dois passer plusieurs fois la souris pour avancer plusieurs fois. De plus la page se bloque dans la direction choisie après quelques décalages (3 ou 4 fois pour chaque direction)

J'ai essayé d'utiliser setTimeout() pour avoir un mouvement continue, mais ça ne fonctionne pas. et si on change de direction, la page bug, comme si elle voulais aller dans les deux directions à la fois... (ce qui me fait dire qu'il y a une boucle infinie)

voici le code :
function defilement(h,v)
{
window.scrollBy(h,v)
setTimeout(function (){defilement(h,v)},100);
}


y a-t-il une erreur ici ou dois-je chercher ailleur?
Afficher la suite 

15 réponses

Meilleure réponse
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
3
Merci
je viens de regarder en modifiant
un ch'tiot poil pour voir ce qui se passe
et tout semble baigner ( IE8 et FF3.5 )

.defilement
{ z-index : 1000;
background-color:#FFFF00; /* pour voir ce qu'on fait */
}
...
<!-- width et height pour dépasser la page -->


<!-- 10 pour voir le déplacement -->
...

Dire « Merci » 3

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

Codes Sources 197 internautes nous ont dit merci ce mois-ci

Commenter la réponse de Bul3
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
Bonjour,
avec ce que vous nous donnez comme infos,
ça ne va pas être simple de répondre !!!
handicapé nasal (**) :

__ defilement est appelé quand ?
__ et surtout : dans la fonction
vous la rappelez allégrement...
et... on en sort quand ?

Cordialement [mon Site] [M'écrire] Bul
(**) ou néanmmoins
Commenter la réponse de Bul3
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
la fonction est appelée au passage de la souris sur une balise
:



Et sans même utiliser le setTimeout, la fonction ne fonctionne que 4 fois pour chaque direction.

ensuite, elle est toujours appelée, les valeurs en paramètre sont toujours les mêmes mais plus rien ne se passe...

Pour la boucle infinie c'est vrai que j'aurais du le voir
Commenter la réponse de Xiarea
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
la boucle infinie : réglé alors.

reste à voir :
>lorsque la souris s'approche des bords de la fenêtre.
or... vous appelez la fonction lorsque la souris
survole le div, pas lorsque "je ne sais quoi"
se rapproche des bords de la fenêtre.
Commenter la réponse de Bul3
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
en fait, je ne comprend pas trop le but...
° un défilement automatique ?
__ de toute le page ?
pourquoi faire ? laissez donc les utilisateurs
"scroller" à leur guise. même si on peut faire.
__ d'un élément de la page ? ( dans ce cas regardez
en css position:fixed et c'est réglé )
Commenter la réponse de Bul3
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
Oui, j'ai placé des divs sur tout le tour de la fenètre, 8 au total, placé sur chaque bord et à chaque angle. lorsque la souris est au dessus, la fonction defilement est appelée. Mais je ne comprends pas pourquoi cela ne fonctionne que 4 fois? (alors que la fin de la page se trouve plus loin, bien entendu.)
Commenter la réponse de Xiarea
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
Le but est de ne pas avoir à toucher aux assenceurs.
L'application doit être utilisable sans souris ni clavier (au stylet, sur un tablet PC)

une autre solution pourrait être de déplacer le document en faisant un "cliquer-glisser"...
Commenter la réponse de Xiarea
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
>>je ne comprends pas pourquoi cela ne fonctionne que 4 fois
faut voir les div, et les appels
( si vous avez rectifié la fonction de déplacement )
Commenter la réponse de Bul3
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
Non decidement je ne vois pas d'ou peu venir le problème. Pour tester j'ai reduit à ceci :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<title>PARE - Vue d'un document</title>
<link rel "stylesheet" media "screen" type = "text/css" title="Design" href="design.css" />
<!-- script js-->
<script type="text/javascript" >
function defilement(h, v, event)
{
window.scrollBy(h, v);
}
</script>		
</head>





<!-- elements de défillement -->



















Le css ne fait que placer les
aux bons endroits, mais le voila quand même :

.defilement
{
z-index : 1000;
}

#defilementNW
{
position : fixed;
top : 0%;
left : 0%;
height : 5%;
width : 5%;
}

#defilementN
{
position : fixed;
top : 0%;
left : 5%;
height : 5%;
width : 90%;
}

#defilementNE
{
position : fixed;
top : 0%;
right : 0%;
height : 5%;
width : 5%;
}

#defilementW
{
position : fixed;
top : 5%;
left : 0%;
height : 90%;
width : 5%;
}

#defilementE
{
position : fixed;
top : 5%;
right : 0%;
height : 90%;
width : 5%;
}

#defilementSW
{
position : fixed;
bottom : 0%;
left : 0%;
height : 5%;
width : 5%;
}

#defilementS
{
position : fixed;
bottom : 0%;
left : 5%;
height : 5%;
width : 90%;
}

#defilementSE
{
position : fixed;
bottom : 0%;
right : 0%;
height : 5%;
width : 5%;
}


(désolé si c'est un peu long)

bref, le problème reste le même, la fonction se lance bien mais seulement 2 fois dans chaque direction, comme si la fin du document se trouvait 2pixels plus loin que l'affichage initial...
Commenter la réponse de Xiarea
Messages postés
13619
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
26
0
Merci
lu chez selfHTML :
scrollBy()
Fait défiler une page automatiquement vers le haut ou le bas,
la gauche ou la droite du nombre de pixels mentionné.
Attend les paramètres suivants:
1. valeur x = Nombre de pixels pour le défilement
vers la gauche ou vers la droite. Les valeurs négatives
défilent vers la gauche, les positives vers la droite.
2. valeur y = Nombre de pixels pour le défilement
vers le haut ou vers le bas. Les valeurs négatives
défilent vers le haut, les positives vers le bas.

vous appelez la fonction qui va faire défiler
la page d'1 pixel, au mieux. déjà.


CordialementBul[mon Site][M'écrire]
Commenter la réponse de cs_bultez
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
Absolument! Et donc la première fois ça fonctionne, la deuxième fois aussi, et la troisième ça ne se décale plus, sauf à repartir de l'autre coté. (avec Firefox)
Ca fonctionne pas mal sous internet explorer 6

Quand le problème avec firefox sera resolu, je ferai boucler pour avoir un mouvement continu.
Commenter la réponse de Xiarea
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
ah... je pensais que c'était une erreur...
uniquement avec FF ?
vous avez debuggé ?


handicapé nasal (**) je jette un
oeil dès que je peux et je tente
de comprendre....


(**) néanmoins quoi
Commenter la réponse de Bul3
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
Merci!

J'ai installé le pluggin web devlopper pour Firefox, qui ne rapporte aucune erreur. Je vais essayer firebug.
Pour Internet Explorer ça fonctionne aussi loin que je puisse passer la souris sur les divs. Ils ne sont pas placés comme je le voudrai, j'ai un petit problème de z-index... Mais c'est une autre histoire...

( pour le "handicapé nasal" que je viens de comprendre :)
Commenter la réponse de Xiarea
Messages postés
26
Date d'inscription
lundi 16 février 2009
Statut
Membre
Dernière intervention
5 octobre 2009
0
Merci
......

En effet, si on remplace les 1 par des 10, ça fonctionne... Je comprends pas bien pourquoi mais bon...

en tout cas Merci Bul3
Commenter la réponse de Xiarea
Messages postés
4934
Date d'inscription
samedi 1 juillet 2006
Statut
Membre
Dernière intervention
2 février 2015
7
0
Merci
pas de raisons...
sauf la vue ???
Commenter la réponse de Bul3