Discussion :

[westernz]

Bonjour,

Je ne sais déjà pas utiliser le focus pour positionner ma page où je le désir.
Je me demande s'il existe quelque chose dans le style, en Jquery en plus le ferait progressivement.

Progressif comme l'ouverture de div

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$('#'+i).animate({height:'toggle'});

Je précise que ce doit être lancé depuis une function et ne doit pas recharger la page.

Bonne journée

[headmax]

Peut être :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
$('#'+i).animate({height:'toggle'}).focus(function(){
  $(this).addClass("active");//ajout d'une class active en css...
})

[westernz]

Mais ca voudrait dire que je dois maitriser le focus.
Et malheureusement, impossible de positionner ma page là où je le souhaite, depuis une function, et sans recharger la page.

C'est pourquoi je me demandais si Jquery n'avais un truc en remplacement.
Sachant que mon exemple n'était qu'un exemple pour exprimé le coté progressif.

Bonne journée

[SpaceFrog]

tu peux expliciter "postionner ma page" ?

Et malheureusement, impossible de positionner ma page là où je le souhaite, depuis une function, et sans recharger la page.

je ne pense pas qu'il s'agisse d'un souci de focus() ni de rechargement

De plus animate accepte un argument de durée pour le coté "progressif" de l'animation.

un screenshot permettrait de mieux cerner ton besoin...

[westernz]

Il faudrait un screen shot vidéo, si mon explication ne va pas je m'attarderai à trouver le moyen d'en faire une.

Selon mes clics, selon un ensemble de paramètre.
Ma function va devoir ouvrir/afficher un div (display='block')
Je veux que la page se positionne pour afficher le haut du claque en haut de la fenêtre. Si ca pouvais même se caler une ligne au dessus du div ce serait super, genre sur une ancre invisible placé au dessus du div.

La scrollbar va donc s'ajuster et passer de son positionnement actuel à la position permettant d'afficher la div ou l'ancre en haut de la fenêtre. Le passage d'une position à l'autre doit être progressif, sans effet de cassure/saccade ou téléportation instantané.

Bonne journée

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

animate({'scrollTop':$('#ancre').offset().top+'px'}, duree)

???

voire avec un easing ...

[westernz]

Je ne connais pas Jquery, juste un poil de logique.
Déjà que je viens tout juste de finir de comprendre php et js, suffisamment pour l'utiliser sans trop demander d'aide, alors Jquery ca attendra un peu. J'y vais doucement.

Tu entend quoi par easying ?

J'ai tenté ceci, et ca ne marche pas : alerte 1 ne passe pas
C'est un code d'exemple pour ne pas afficher tout mes codes inutilement.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script type="text/javascript" src="./js/jquery.js"></script>
<script>
 
function test()
{
animate({'scrollTop':$('#ancre').offset().top+'px'}, 30);
alert('1');
}
</script>
 
<a href='javascript:test()'>Lien pour test</a>
<br /><br />
 
DEBUT
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
Anc<a id='ancre' name='ancre'></a>re
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
FIN

[SpaceFrog]

animate est une methode qui s'applique à un objet, il serait bon que tu étudies un minimum les bases de jquery au lieu d'espérer que l'on code à ta place .
Il est donc normal que l'alert ne s'affiche pas

le animate s'applique à l'objet dont tu veux animer le scroll en jouant sur sa propriété scrollTop

Quant à l'easing tu n'as même pas pensé demander à google ? "jquery easing

easing est un complément de jquery qui permet de moduler les animations au lieu d'avoir une animation régulière le easing permet d'ajouter des effets de translation ( accélérations, décéleration, rebonds ...)

Quand à ta durée de animate, si tu avais pris un tant soit peu la peine de te documenter sur le sujet, tu aurais lu dans la doc que la durée est exprimée en millisecondes ... faire une animation sur 30 millisecondes est vain.

[westernz]

Il est vrai que je manque de documentation.
J'en ai lu, j'en ai compris, j'en ai pas compris, j'en ai oublié.

Quand à la durée, la scroll barre aurait se positionner en 30ms, elle n'a pas bougée. Idem avec 3000. J'avais essayé plusieurs valeur. Je ne note pas tout ce que j'ai pu essayer ou lire pour éviter de placer un texte de 50 pages.

Mon alerte n'est pas dans le animate lui même elle devrait passer.

Il faut aussi prendre en compte qu'aider un novice n'est pas la même chose qu'aider un érudit en la matière. Et c'est bien les novices qui ont le plus besoin d'une aide attentionnée, pour faire comprendre puis maitriser et de plus demander d'aide. Ce fut mon cas pour le php et js. Un ami m'a aidé à programmer et apprendre sur le tas pendant 3 ans. Aujourd'hui il est rare que je lui demande de l'aide. Lire les instructions ou tutoriel, j'ai fais, et c'est bon quand on s'y connais déjà suffisamment. L'autre choix est un apprentissage couteux que je ne peux pas me payer.

Au final, le code ne marche pas.
J'ai fais diverses tentatives.
Je passe à autre chose et j'y reviendrai plus tard, je sature.

Bonne journée

[SpaceFrog]

Mon alerte n'est pas dans le animate lui même elle devrait passer.

non une erreur javascript est bloquante ...

la syntaxe est

$('#idobjet').animate( ....)

[westernz]

Donc si je construite plus proprement.
Je me retrouve avec 2 appellation identique.
C'est ce qui m'a trompé.
Mais c'est aussi ce qui me semble étrange.

Pour l'ID ancre, lancer animation : placer sur le scroll sur le top de l'ID, action étalée sur 3000 ms.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

 $('#ancre').animate({'scrollTop':$('#ancre').offset().top+'px'}, 3000) ;

Ca ne marche toujours pas mais l'alert est fonctionelle cette fois-ci.

J'ai aussi trouver ceci en fouaillant avec scrollTop comme mot clé.
Lien
Je pense que ce ne recharge pas la page.
Ca me semble bien long comparer à votre proposition.
Je vais essayer d'en prendre quelques partie, de tester des trucs.

Car j'ai beau regarder des exemple ou des tuto, sans comprendre la pluspart des codes je ne peux pas analyser ce que je vois. Et comprendre voudrait dire minimum 1 an de formation Donc petit bout pas petit bout, sur le tas, comme je l'ai fais en php et JS.

Pour info, mon site est an16.org , je tente de faire maintenant des pages nikel, plus dynamiques, pendant que je fais mon dernière module.

Bonne journée

[SpaceFrog]

heu c'est pas l'ancre qu'il faut animer ... mais le conteneur qui scrolle ...