11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je suis en train de créer mon premier site web, Youhou !
Je suis confronté à plusieurs problèmes, notamment :
- Quand je suis dans une des catégories de "Portfolio" et que je clique sur "Contact", le menu déroulant se referme automatiquement : se qui m'enbête vraiment !! Smiley fache
Merci de vos réponses.

Pierre.

Voici un lien vers le site.
Désolé pour la Pub : hébergeur gratuit...

http://pevdp.freeheberg.com/
Modérateur
Bonjour,

Je trouve ça plutôt logique... c'est une liste déroulante qui, par défaut, est contractée donc partant de là, quand tu changes de page, normal qu'elle revienne à l'état initial non ?
Tu dois rencontrer le même problème quand tu reviens à l'accueil ou en rafraichissant la page..
Sinon il faut que ton menu entier soit tout le temps visible.
_laurent a écrit :
Bonjour,

Je trouve ça plutôt logique... c'est une liste déroulante qui, par défaut, est contractée donc partant de là, quand tu changes de page, normal qu'elle revienne à l'état initial non ?
Tu dois rencontrer le même problème quand tu reviens à l'accueil ou en rafraichissant la page..
Sinon il faut que ton menu entier soit tout le temps visible.


Oui le problème est le même quand je rafraîchi la page ou quand je reviens à l'accueil mais il me dérange moins dans ce cas là.
Malgré une question de logique j'aimerai bien résoudre ceci qui pour moi est un problème.
Je trouve que un menu doit s'ouvrir et se fermer de façon intentionnel.
Modérateur
Je comprend le raisonnement Smiley smile

Pour faire ça, soit tes pages doivent communiquer ensemble (se passer le mot "le menu est ouvert" ou "le menu est fermé") (donc en php) soit tu ne changes pas de page et seul ton contenu change (mais pas trop conseillé).

Cependant ton menu n'est (vraiment) pas gros, tu pourrais le laisser déroulé. Tu économises un clic à l'utilisateur et de la lisibilité : le contenu de ton site n'est pas directement accessible du coup et le clic sur "Portfolio" ne sert qu'a dérouler le menu et n’amène pas sur une page en particulier.

Il y a quelques problème d'ergonomie (comme un effet au survol des menus ou des liens pour montrer qu'il est cliquable etc..) mais ce n'est pas le sujet Smiley murf

Bonne continuation
_laurent a écrit :
Je comprend le raisonnement

Pour faire ça, soit tes pages doivent communiquer ensemble (se passer le mot "le menu est ouvert" ou "le menu est fermé") (donc en php) soit tu ne changes pas de page et seul ton contenu change (mais pas trop conseillé).


Bonne continuation


Donc rien à voir avec le JavaScript que j'ai déjà ?
Comme je disais je débute donc mes connaissances sont encore très faibles.
Modérateur
pevdp a écrit :
Donc rien à voir avec le JavaScript que j'ai déjà ?

Non. Ton javascript permet de dérouler le menu. Il regarde aussi la page sur laquelle tu es, et si il s'agit d'une des pages "enfants" il laisse le menu déroulé.

Contrairement a ce que tu veux faire, ton code ne regarde et n'agit que sur la page actuelle et non par rapport a celle dont tu viens.

Si tu veux suivre ton idée il faut passer un argument entre les pages :
a écrit :
se passer le mot "le menu est ouvert" ou "le menu est fermé"

Ça doit être possible en Javascript via l'url mais je te laisse ici car je n'ai jamais fait.

Bon courage
_laurent a écrit :

Non. Ton javascript permet de dérouler le menu. Il regarde aussi la page sur laquelle tu es, et si il s'agit d'une des pages "enfants" il laisse le menu déroulé.

Contrairement a ce que tu veux faire, ton code ne regarde et n'agit que sur la page actuelle et non par rapport a celle dont tu viens.

Si tu veux suivre ton idée il faut passer un argument entre les pages : se passer le mot "le menu est ouvert" ou "le menu est fermé
Ça doit être possible en Javascript via l'url mais je te laisse ici car je n'ai jamais fait.

Bon courage


Ok merci.
Et si je fais sa en PHP, tu as une idée de la fonction a utiliser ?
Modifié par pevdp (26 Jan 2012 - 17:25)
Modérateur
_laurent a écrit :
Pour faire ça, soit tes pages doivent communiquer ensemble (se passer le mot "le menu est ouvert" ou "le menu est fermé") (donc en php)

Je me suis un peu égaré, le transfert de paramètres en php c'est essentiellement pour les formulaires.
_laurent a écrit :
Ça doit être possible en Javascript via l'url

La aussi erratum : c'est possible en php, mais ça surcharger l'url du coup. Tu peux éventuellement passer une lettre en paramètre dans ton url (o pour ouvert et f pour fermé)

http://www.info-3000.com/phpmysql/formulaire.php
Bon, je viens de m'initier au Php, c'est chouette, je n'ai plus besoin de copier tout sur chacune des pages !
Mais alors pour se qui est de ta dernière réponse, je n'ai pas du tout compris... Smiley ohwell

_laurent a écrit :
La aussi erratum : c'est possible en php, mais ça surcharger l'url du coup. Tu peux éventuellement passer une lettre en paramètre dans ton url (o pour ouvert et f pour fermé)

http://www.info-3000.com/phpmysql/formulaire.php

Modifié par pevdp (27 Jan 2012 - 20:33)
Bonjour,

Il y a à coup sure plus simple que ce que je vais proposé. Ce n'est qu'a titre indicatif !

Tu peux faire en sorte que tout ton menu, soit encadré par un formulaire <form> </form>

Lorsque tu clique sur un lien de ton menu, tu éxécute une petite fonction javascript qui va s'occuper de traiter la destination choisi par l'utilisateur (dans l'exemple "Home") et traiter également le Menu qui a été utilisé (exemple : "Menu1"). C'est deux information étant envoyés a la page demandée, et facilement récupérable par PHP !


<script language="javascript" type="application/javascript">
function nav(destination,menuid) {
    document.getElementById('nav').action = 'index.php?do='+destination;
    document.getElementById('MenuLastState').value = menuid;
    document.getElementById('nav').submit();
}
</script>



<form id="[#red]nav[/#]" method="[#red]post[/#]" enctype="text/plain" action="[#red]index.php[/#]">
<!-- Code divers qui compose le menu -->
<!-- Pour l'exemple, un lien du menu : -->
[#red]<a href="index.php?do=home" onclick="nav('home','menu1');return false;">Home</a>[/#]
<!-- Code divers qui compose le menu -->
[#red]<input type="hidden" id="MenuLastState" value="" />[/#]
</form>


Le formulaire qui est validé par la fonction javascript (ce qui a le même effet que de cliquer sur un input type submit), renvoie sur la page choisi par la méthode GET : index.php?do=home
-> Pouvant être récupèré par PHP : $_GET['do'];
Il envoie également par la méthode POST, le menu ("menu1") qui a été utilisé !
-> Pouvant être récupèré par PHP : $_POST['MenuLastState'];

En espérant ne pas avoir embrouillé plus qu'aidé ^^

Bon courage.
fraxken a écrit :
Bonjour,

Il y a à coup sure plus simple que ce que je vais proposé. Ce n'est qu'a titre indicatif !

Tu peux faire en sorte que tout ton menu, soit encadré par un formulaire &lt;form&gt; &lt;/form&gt;

Lorsque tu clique sur un lien de ton menu, tu éxécute une petite fonction javascript qui va s'occuper de traiter la destination choisi par l'utilisateur (dans l'exemple &quot;Home&quot;) et traiter également le Menu qui a été utilisé (exemple : &quot;Menu1&quot;). C'est deux information étant envoyés a la page demandée, et facilement récupérable par PHP !



Le formulaire qui est validé par la fonction javascript (ce qui a le même effet que de cliquer sur un input type submit), renvoie sur la page choisi par la méthode GET : index.php?do=home
-&gt; Pouvant être récupèré par PHP : $_GET['do'];
Il envoie également par la méthode POST, le menu (&quot;menu1&quot;) qui a été utilisé !
-&gt; Pouvant être récupèré par PHP : $_POST['MenuLastState'];

En espérant ne pas avoir embrouillé plus qu'aidé ^^

Bon courage.



Merci de ta réponse.
Je viens d'essayer en copiant ton code mais sa ne fonctionne pas, je pense avoir mal compris ou copier le code.
On pourrait aussi comparer les liens du menu avec l'adresse actuelle et ouvrir le menu correspondant une fois qu'on a trouvé le lien.
Gothor a écrit :
On pourrait aussi comparer les liens du menu avec l'adresse actuelle et ouvrir le menu correspondant une fois qu'on a trouvé le lien.


Traduction ?