scrollbar jquery perdu dans son flux

Eléphant du PHP | 363 Messages

29 déc. 2011, 00:16

Bonsoir,

Je rencontre une petite difficulté avec ma scrollbar jquery. J'ai mis en place des ancres nommées et du coup quand je clique le pointeur (la scrollbar) ne suit pas.

Comme je travaille sur un intranet c'est difficile de vous montrer. Si je clique sur le 40ème enregistrement, j'arrive bien sur le 40ème mais la scrollbar considère que c'est le premier enregistrement donc je ne peux pas scroller vers le haut pour lire les autres, je ne sais pas si je suis très claire 8-|

Merci de votre aide Messieurs, dames.

Kiss
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

Eléphant du PHP | 363 Messages

29 déc. 2011, 00:47

ps : je me suis trompée, ça n'a pas sa place dans php avancé
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

ViPHP
ViPHP | 2287 Messages

29 déc. 2011, 01:52

Hello,

Le plugin jQuery que tu utilises doit être pourvu d'une méthode qui provoque le rafraîchissement de la scrollbar.

La solution serait donc d'inclure l'appel explicite de cette fonction pour chaque clic sur les liens vers tes ancres...
if(!@work()){ Nespresso(); } else { what(); }
______________________________

Eléphant du PHP | 363 Messages

29 déc. 2011, 10:36

Bonjour Calimero et merci.

En fait, je viens d'une autre page donc il n'est pas question de rafraichissement de la scroll dynamique, c'est bizarre c't'histoire #-o

Féfé
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

ViPHP
ViPHP | 2287 Messages

29 déc. 2011, 15:03

Bonjour Calimero et merci.

En fait, je viens d'une autre page donc il n'est pas question de rafraichissement de la scroll dynamique, c'est bizarre c't'histoire #-o

Féfé
Dans ce cas ce serait au chargement de la page (ou plus exactement juste après, une fois le contenu complètement chargé et la navigation positionnée sur l'ancre) qu'il faudrait appliquer la même technique. Mais il est étrange que ton plugin ne le fasse pas déjà tout seul. Au pire essayes-en un autre.
if(!@work()){ Nespresso(); } else { what(); }
______________________________

Eléphant du PHP | 363 Messages

29 déc. 2011, 16:55

Bah ca m'embête dans la mesure ou ce scroll marche très bien hormis ça mais je pensais :

Je suis dans une div scrollable avec un overflow caché.

C'est jouable de récupérer la position du scroll de ma div et ensuite d'impacter la scrollbar dynamique en conséquence ?

C'est p'tet une idée idiote...
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

ViPHP
ViPHP | 2287 Messages

29 déc. 2011, 17:51

Bah ca m'embête dans la mesure ou ce scroll marche très bien hormis ça mais je pensais :

Je suis dans une div scrollable avec un overflow caché.

C'est jouable de récupérer la position du scroll de ma div et ensuite d'impacter la scrollbar dynamique en conséquence ?

C'est p'tet une idée idiote...
C'est une très bonne idée, c'est d'ailleurs ce que ton plugin de scrollbar est censé faire tout seul comme un grand... D'où mes suggestions.

Au pire fais une capture html (fonction enregistrer la page de ton navigateur) en veillant à enregistrer aussi les css/js nécessaires pour pouvoir nous montrer un exemple du bug.
if(!@work()){ Nespresso(); } else { what(); }
______________________________

Eléphant du PHP | 363 Messages

29 déc. 2011, 17:52

Re re re,

Voilà un p'tit exemple que j'ai reconstruis :

la page 1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>
<body>
<div style="width:200px;height:100px;overflow:scroll;">
<p><a href="page2.html#J";>lettre J</a></p>
<p><a href="page2.html#I";>lettre I</a></p>
<p><a href="page2.html#H";>lettre H</a></p>
<p><a href="page2.html#G";>lettre G</a></p>
<p><a href="page2.html#F";>lettre F</a></p>
<p><a href="page2.html#E";>lettre E</a></p>
<p><a href="page2.html#D";>lettre D</a></p>
<p><a href="page2.html#C";>lettre C</a></p>
<p><a href="page2.html#B";>lettre B</a></p>
<p><a href="page2.html#A";>lettre A</a></p>
</div>
</body>
</html>
la page 2 qui doit être au même niveau :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
	<script>
    function pozscroll(){
		alert(document.getElementById("madivscrollable").scrollTop);
	}
    </script>
</head>
<body onload="javascript:pozscroll();">
<div id="madivscrollable" style="width:200px;height:100px;overflow:scroll;">
<a name="J"></a>
<h1>J</h1>
<a name="I"></a>
<h1>I</h1>
<a name="H"></a>
<h1>H</h1>
<a name="G"></a>
<h1>G</h1>
<a name="F"></a>
<h1>F</h1>
<a name="E"></a>
<h1>E</h1>
<a name="D"></a>
<h1>D</h1>
<a name="C"></a>
<h1>C</h1>
<a name="B"></a>
<h1>B</h1>
<a name="A"></a>
<h1>A</h1>
</div>
</body>
</html>
mais ca marque toujours 0 même si l'ascenceur est plus bas :cry:

Ps : document.body ou document.documentElement ne fonctionnent pas non plus grrrrrrr #-o
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

ViPHP
ViPHP | 2287 Messages

29 déc. 2011, 20:22

mais ca marque toujours 0 même si l'ascenceur est plus bas :cry:
Car tu as mis l'appel dans le onload, c'est à dire pendant le chargement de la page, quand le html n'est pas encore complètement arrivé (du coup le scroll de l'ancre n'est pas encore fait). Tu l'aurais mis n'importe où ailleurs (par exemple lors du clic sur un bouton de test) ça marchait impec.
<button onclick="pozscroll();">voir scrolltop</button>
... ce serait au chargement de la page (ou plus exactement juste après, une fois le contenu complètement chargé et la navigation positionnée sur l'ancre) qu'il faudrait appliquer la même technique.
... en veillant à enregistrer aussi les css/js nécessaires...
Parceque sans la fausse scrollbar, ben ça va être dur de voir et de tester ton bug 8-|
if(!@work()){ Nespresso(); } else { what(); }
______________________________

Eléphant du PHP | 363 Messages

30 déc. 2011, 01:00

Re, désolée pour le p'tit délai.

J'étais sure qu'on pouvait mettre des pièces jointes mais apparemment non et comme j'ai pas d'hébergeur, j'ai fait appel à un ami Jean-Pierre (ok c'est nul)

Tout est dans le vlite.zip sur http://euryteneb.free.fr/

MERCI Calimero pour ton investissement à mon égard.
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

Eléphant du PHP | 363 Messages

30 déc. 2011, 13:07

J'ai essayé de déclencher la fonction après n secondes avec setTimeout mais rien n'y fait.

C'est so strange et comme tu dis ça devrait être géré nativement d'autant plus que le code de détection est présent |*()
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?

ViPHP
ViPHP | 2287 Messages

30 déc. 2011, 17:05

Re, désolée pour le p'tit délai.

J'étais sure qu'on pouvait mettre des pièces jointes mais apparemment non et comme j'ai pas d'hébergeur, j'ai fait appel à un ami Jean-Pierre (ok c'est nul)
On peut mais c'est un peu caché (onglet "Ajouter des fichiers joints" caché par défaut, sous le formulaire de post).
Tout est dans le vlite.zip sur http://euryteneb.free.fr/

MERCI Calimero pour ton investissement à mon égard.
Pas de quoi, ton problème est intéressant. Merci à toi d'avoir reconstruit et posté un exemple malgré tes contraintes.

J'ai fait quelques tests en m'appuyant sur les infos de la page officielle du plugin et son code source non-compressé dans sa dernière version :
http://www.baijs.nl/tinyscrollbar/
http://www.baijs.nl/tinyscrollbar/js/jq ... rollbar.js

Apparemment il ne supporte pas les ancres nommées de base (pas bon pour toi). De plus, le plugin s'appuie sur du positionnement et des propriétés CSS (alors que le navigateur, pour scroller, manipule la propriété scrollTop de manière tardive - et pas sur le même élément bien sûr).

Si j'étais toi je changerais de plugin, je me souviens qu'il existe des alternatives qui ne posent pas ce souci (sans me rappeler du nom exact toutefois donc je ne peux pas te donner de lien...). Mais si tu tiens vraiment à le garder, tu peux peut-être compenser le problème avec le code suivant, qui donne quelques résultats (page2.html), en tout cas c'est un point de départ si tu veux poursuivre le contournement :
	<script type="text/javascript">
		function fixScroll(){
                  // On récupère la valeur du scrollTop du viewport (correspondant à un scroll du browser pour atteindre une ancre)
		  var anchorScroll=$j('#divkiscroll').find('.viewport').get(0).scrollTop;
                  // On remet le scrollTop à 0
		  $j('#divkiscroll').find('.viewport').get(0).scrollTop=0;
		  // On injecte cette valeur dans le plugin pour rafraichir la scrollBar en bonne position.
		  $j('#divkiscroll').tinyscrollbar_update(anchorScroll);
                           
		  return true;
		}


		$j(document).ready(function(){
			$j('#divkiscroll').tinyscrollbar(); // initialisation du plugin
			window.setTimeout("fixScroll()",150); // On appel le refresh au bout de 150ms (valeur arbitraire, chez moi ça marche)
			$j(window).bind('hashchange',fixScroll); // l'event hashchange est appelé en cas de clic d'une ancre nommée intrapage.
		});
	</script>
</head>
<body>

......

<button onclick="fixScroll()">fix scroll</button>
</body>
</html>
La fonction fixScroll fait bien son boulot, c'est + au niveau du reste (liaison avec les évènements, timeout) qu'il y aurait des tests & ajustements à faire. Je te passe la main :)
if(!@work()){ Nespresso(); } else { what(); }
______________________________

Avatar du membre
Administrateur PHPfrance
Administrateur PHPfrance | 13231 Messages

31 déc. 2011, 11:10

ps : je me suis trompée, ça n'a pas sa place dans php avancé
Déplacé
Connaître son ignorance est la meilleure part de la connaissance
Pour un code lisible : n'hésitez pas à sauter des lignes et indenter

twitter - site perso - Github - Zend Certified Engineer

Eléphant du PHP | 363 Messages

02 janv. 2012, 11:28

Tonnerre de Zeus, mais ça marche du feu de dieu Cali (pas le chanteur hein :lol:)

L'arbitraire, ça a du bon des fois :D

MERCI BCP à tous les 2.

Bisous et douce année 2012 :love7: si dieu enfin Zeus le veut :wink:
Dis-donc fossoyeur, t'as une dent contre moi ou quoi ?