Bonjour à tous,

tout d'abord, je sais que ce n'est pas la bonne catégorie pour post mais il n'y as pas de catégorie spécial AJAX.

Voici mon problème :
Je voudrais réaliser un menu horizontal pour mon site, avec un élément qui translate en dessous le menu suivant le choix que l'utilisateur fais.

Je m'explique :
Mon menu possède 5 catégories, je voudrais que lorsque l'utilisateur clik sur tel ou tel catégorie, une flèche (l'élement qui translate) bouge de la page actuelle à la page demander (en restant sous mon menu!)

Je ne vois donc pas d'autre solution que d'utiliser de l'ajax au moins pour le menu.
Mon soucis : aucune connaissance en ajax et très médiocre en javascript...
Mon deuxieme soucis: comment faire pour que ma flèche bouge ? utilisation du javascript dans le code ajax ?

Si quelqu'un connais des tutos ou à deja fais quelque choses du genre.... votre aide serais la bienvenue!

Merci

Bonjour,
première question, la navigation est-elle en AJAX? ou classique?
Je veux dire, ta page se recharge complètement? ou seulement un élément choisi?

L'AJAX sert tout d'abord à effectuer des appels serveurs asynchrones. donc du js classique devrait aller je pense
ensuite, je te conseil les tutos sur ce site pour le JS natif, et l'utilisation de la librairie jQuery, qui permet de faire facilement des choses complexes

L'utilisation de jQuery pourra (plus facilement) animer ton élément qui se situe sous ton menu (fonction animate).


ou en natif (je sais pas comment ta page est structurée), tu peux positionner un div en dessous de ton menu, en relative. et tu te sers de la fonction setInterval(deplace(), 1000) qui te permet d'appeler dans ce cas (une fonction toute les 1000 milisecondes),
La fonction deplace va seulement augmenter ou diminuer la position left de ton élément de quelques pixel.
Ainsi tu verras une "animation".

Voilà l'idée, reste à coder
Bon courage

Merci bien,
Mon contenu se recharge complétement mais ma navigation reste. C'est pourquoi je voulais faire uniquement le menu en ajax pour que "l'animation" de mon élément apparaisse.
Je ne sais pas ce que tu appel javascript natif je vais me renseigner !

Donc si j'ai bien compris tu pense que mon menu avec l’élément translatant peut se faire uniquement en JS et Jquery ?

Hum...

Va voir ici j'ai fini mais je ne sais pas si c'est ce que tu veut vraiment...
CADEAU

ChickN

en fait y'a un point que je n'arrive pas à saisir. à quel moment tu veux que l'image se déplace?
au clic et avant que la page se recharge?
ou après le chargement de la page, le menu se met à jour?
car pendant le chargement, ça risque d'etre problematique


le javascript natif est le js sans plugin, sans libraire, avec les instructions de bases.

@ChickN merci, mais ce n'est pas cela que je cherche a faire =/

@Dhampir je voudrais que l'on click sur la catégorie, la flèche se déplace de la page présente à la page demandée et ensuite le contenu s'affiche.



Mon menu est horizontal composé de la sorte :

accueil | Page1 | Page2 | Page3 | Page4


avec par exemple la flèche sous accueil, lorsque l'on clik sur pageX elle ce déplace de accueil à pageX et cela a chaque fois que l'on click sur une autre catégorie

Salut,

Si tu change ton contenu avec ajax mais que ta navigation reste, je pense qu'il n'est pas nécessaire que tu utilise ajax pour faire bouger la flèche en dessous des liens. Javascript et/ou Jquery avec une fonction au "onclick" devraient suffire !

la réponse de Jeff94 correspond je pense au besoin.
Cependant, si tu gardes une navigation classique (rechargement complet de la page), tu vas être heurté à des problématiques ...

Pour vraiment avoir un résultat fluide, il faudrait mettre à jour le contenu de ta page de manière dynamique (appels Ajax qui te rameneront le contenu de la nouvelle page), puis tu peux lancer ton animation en js et/ou jQuery

Ainsi, la totalité de la page ne sera pas mise à jour et tout se fera en un coup.