Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1155 connectés 

  FORUM HardWare.fr
  Programmation

  [Webmaster] Besoin de vos experiences ....

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[Webmaster] Besoin de vos experiences ....

n°29686
petoulachi
A fortiori, brigadier chef
Posté le 07-05-2001 à 15:53:27  profilanswer
 

Hello et merci de vous interresser a moi !
Bon en gros :
je realise le site d'une entreprise pour mon stage. C un site assez volumineu, et il faudrait que la frame de gauche contienne le menu de la section en cours. Donc je compte le faire en dynamique. Mais je ne sais aps trop comment faire le script qui va creer ce menu ....
Voius avez surement deja du en faire vous, alors quels sont vos idées et conseils ?
merci ! :jap:

mood
Publicité
Posté le 07-05-2001 à 15:53:27  profilanswer
 

n°29696
MagicBuzz
Posté le 07-05-2001 à 16:10:36  profilanswer
 

si tu pouvais donner plus d'infos... utiles de préférence...
 
Script : Côté client ou côté serveur ?
Contenu : Statique ou dynamique (y'a une base de données derrière ou pas ?)
Les pages, elles statiques ou dynamique ? (pareil)
L'arboressance, c'est koi ?
...

n°29697
darkoli
Le Petit Dinosaure Bleu
Posté le 07-05-2001 à 16:11:28  profilanswer
 

ben en gros il faut utiliser (avec ie5) :
 
  les listes :
   <ul id="root">
    <li onclick="c(1)">menu 1
    <ul id="menu1"></ul>
    <li onclick="c(2)">menu 2
    <ul id="menu1"></ul>
    ...
   <ul>
 
c'est ce que j'ai fait (je te file le script ce soir il est un peu gros). En gros quand tu clique sur un element de la liste , j'affiche la page dans la frame a coté et en meme temps j'ouvre ou je ferme le sous menu contenu dans la liste suivante : UL.
quans la liste n'est pâs affiché il faut faire un display:none comme ca la liste disparait.
 
je poste ca ce soir en beaucoup plus clair et avec l'exemple du script que j'ai fait moi meme, il est base sur le menu du site msdn de microsoft : http://msdn.microsoft.com/library/

n°29703
petoulachi
A fortiori, brigadier chef
Posté le 07-05-2001 à 16:16:52  profilanswer
 

merci darkoli, par contre j'ai homis de mettre qu'il faut que cela soit compatible avec netscape 4.x et IE4.x ...
magicbuzz, les scripts sont des javascripts, il n'y a pas de basse de données derriere ; ce que j'apelle dynamique, c que le contenu de la frame s'ecrit suivant la section dans laquelle on se trouve ....
l'arborescence de quoi ?

n°29705
MagicBuzz
Posté le 07-05-2001 à 16:19:42  profilanswer
 

ok :)
je croyais que tu voulais générer l'arboressance de façon automatique, c'est pour ça :)

n°29710
darkoli
Le Petit Dinosaure Bleu
Posté le 07-05-2001 à 16:27:59  profilanswer
 

petoulachi a écrit a écrit :

merci darkoli, par contre j'ai homis de mettre qu'il faut que cela soit compatible avec netscape 4.x et IE4.x ...
magicbuzz, les scripts sont des javascripts, il n'y a pas de basse de données derriere ; ce que j'apelle dynamique, c que le contenu de la frame s'ecrit suivant la section dans laquelle on se trouve ....
l'arborescence de quoi ?




 
ben pour ie4 ca devrait etre ok mais pour ns je ne pense pas mais il ne doit y avoir trop de conversion a faire... (desole je netraville que sur ie (c'est pas moi qui decide)).

n°29711
MagicBuzz
Posté le 07-05-2001 à 16:29:11  profilanswer
 

darkoli a écrit a écrit :

 
(desole je netraville que sur ie (c'est pas moi qui decide)).




Vas-y comme t'as trop de la chance toi :love:

n°29712
petoulachi
A fortiori, brigadier chef
Posté le 07-05-2001 à 16:32:34  profilanswer
 

C clair t'as bien de la chance a ne bosser que sous IE.  
Bon j'espere que ton script sera pas trop galere a porter sous netscape (je ne parts pas vaincueur avec lui ...) :(

n°29715
MagicBuzz
Posté le 07-05-2001 à 16:35:06  profilanswer
 

petoulachi a écrit a écrit :

C clair t'as bien de la chance a ne bosser que sous IE.  
Bon j'espere que ton script sera pas trop galere a porter sous netscape (je ne parts pas vaincueur avec lui ...) :(




Ce qui me gave à mort c'est que j'avais fait un script comme ça intégralement paramétrable en plus, qui marchait sous NS et tout... (par contre, ça rechargeait la page à chaque fois) mais je l'ai pas sous la main... et je sais pas si je l'ai encore... :(

n°29719
petoulachi
A fortiori, brigadier chef
Posté le 07-05-2001 à 16:42:38  profilanswer
 

ha ? he bin c dommage :)
Sinon c normal que certain script marchent sous netscape 4.x et pas sous netscape 6 ???

mood
Publicité
Posté le 07-05-2001 à 16:42:38  profilanswer
 

n°29722
MagicBuzz
Posté le 07-05-2001 à 16:47:20  profilanswer
 

petoulachi a écrit a écrit :

ha ? he bin c dommage :)
Sinon c normal que certain script marchent sous netscape 4.x et pas sous netscape 6 ???




Ouais, NS6 supporte à peut près autant les scripts que NS 3.0
Les versions 4.x étaient trop pourries, donc ils ont fait marche arrière... NS 6.0 supporte HTML 3.2 seulement.
IE et NS 4.x supportent le HTML 4.0
 
(mais chez NS ils ont essayé d'imposer des merdes ce qui fait que NS 4.x n'(était pas conforme à HTML 4.0, d'où les incompatibilités)

n°29723
petoulachi
A fortiori, brigadier chef
Posté le 07-05-2001 à 16:49:20  profilanswer
 

Dis moi magicbuzz je matte ton site et je vois que tu parles de pb avec netscape et les colspan ? je crois que j'ai ce pb moi :

Code :
  1. <table border="0" cellpadding="0" cellspacing="0" width="100%" height="90">
  2. <tr>
  3.     <td rowspan="3" width="153" height="90" valign="top">
  4.     <img src="images/logo.jpg" width="153" height="90" border="0">
  5.     </td>
  6.     <td rowspan="2" width="80%" height="60" bgcolor=#7AADFF valign="middle">
  7.     <form name="formulaire">
  8.      <input type="text" name="bandeau" size="45"></form>
  9.     </td>
  10. <!--cellule du moteur de recherche-->
  11.     <td rowspan="2" width="100" height="60" bgcolor="#7AADFF" valign="middle" align="right">
  12.  <form name="form">
  13.      <input type="text" value="search for ?" name="search" size="15" maxlength="100">
  14.      <a href="javascript: search();">
  15.          <img src="images/ok.gif" border="0" width="24" height="22" alt="start research" align="absbottom">
  16.      </a>
  17.         </form>
  18. </td>
  19.     <td width="30" height="30" align="right" valign="top" bgcolor=#7AADFF>
  20.         <img src="images/arrondihautdroit1.jpg" width="30" height="30" border="0">
  21.     </td>
  22. </tr>
  23. <tr>
  24.     <td width=30 height=30 valign="baseline" bgcolor=#7AADFF align="right">
  25.     <img src="images/arrondihautdroit2.jpg" width=30 height=30 border=0 align="absbottom">
  26.     </td>
  27. </tr>
  28. <tr>
  29.     <td width="32" height="30" valign="top">
  30.     <img src="images/arrondihautgauche.jpg" width="32" height="30" border="0">
  31.     </td>
  32.     <td colspan="3" width="100%" height="30"> </td>
  33. </tr>
  34. </table>


 
il est ou le pb ??

n°29724
darkoli
Le Petit Dinosaure Bleu
Posté le 07-05-2001 à 16:53:28  profilanswer
 

voici le principe de mon menu :
 
  j'ai un objet menu qui contient les infos necessaire pour un element du menu : numero du noeud parent, url, nom,...
  j'ai toute les fonction qui gerent automatiquement le menu : ouverture et fermeture et creation du dynamique du menu si celui ci n'existe pas.
  pour creer un menu c'est super facile :
    => le code de gestion est le meme quelque soit le menu.
    => il faut simplement initialiser le contenu du menu a l'aide de la fonction numero_noeud=ajout(nom_element,lien_url,numero_noeud_parent);
  nom_element : nom qui est affiché en HTML
  lien_url : url a ouvrir dans la frame a coté s'il n'y a rien a faire, mettre "-"
  numero_noeud_parent : numero du noeud parent retourné par la fonction lors de sa creation, -1 si noeud racine.
 
exemple :
 

Code :
  1. *1
  2.    a
  3.    b
  4.   2
  5.    c
  6.    d
  7.     1
  8.    e
  9.   3
  10. l'etoile indique que 1 ne point sur aucune page.
  11. tmp0=ajout("1","-",-1);
  12.      ajout("a","tata.html",tmp0);
  13.      ajout("b","tete.html",tmp0);
  14. tmp0=ajout("2","titi.html",-1);
  15.      ajout("c","toto.html",tmp0);
  16. tmp1=ajout("d","tutu.html",tmp0);
  17.      ajout("1","rara.html",tmp1);
  18.      ajout("e","rere.html",tmp0);
  19. tmp0=ajout("3","riri.html",-1);

n°29725
MagicBuzz
Posté le 07-05-2001 à 16:55:11  profilanswer
 

Surtout, vire tout tes rowspan... Parceque même IE a beaucoup de mal des fois... A la limite fait des tableaux imbriqués si tu veux pas couper tes images, mais enlève les rowspan de suite !
 
Ensuite, le <form> et </form> met-les autour des <tr> et </tr>
Bah ouais NS il est concon il il aime pas ça... (d'ailleurs, met les autour du tableau, comme ça t'es sûr que ça fait plus chier.
 
Pour finir, ne laisse jamais d'espace après une balise <td>, ni avant une balise </td>
 
=>
 
   <td width="32" height="30" valign="top">  
     <img src="images/arrondihautgauche.jpg" width="32" height="30" border="0">  
    </td>
 
Ca devient :
 
   <td width="32" height="30" valign="top"><img src="images/arrondihautgauche.jpg" width="32" height="30" border="0"></td>
 
Sinon, explosion totale de la page sous NS assurée dès que la page commence à être chargée.

n°29770
darkoli
Le Petit Dinosaure Bleu
Posté le 07-05-2001 à 20:37:56  profilanswer
 

voila comme promis mon javascript :  
tout en bas il y a [...], qu'il faut remplacer par l'ajout des elements du menus
 

Code :
  1. <html>
  2. <head>
  3. <title>menu</title>
  4. <style>
  5.    a {color:003366;text-decoration:none}
  6.    a:hover {color:6699CC;text-decoration:underline overline}
  7.    pre {font-family:verdana;font-size:12px}
  8.    li {list-style:none;margin-left:0px;margin-bottom:0px;margin-top:0px;vertical-align:middle}
  9.    li img {cursor:hand}
  10.    ul {margin-left:15px;display:none}
  11.    ul.root {margin-left:0px;display:block}
  12. </style>
  13. </head>
  14. <body>
  15. <pre>
  16. <ul id=liste class="root">
  17. </ul>
  18. </pre>
  19. <script language="javascript">
  20.   var listes=new Array();
  21.   var nbl=0; 
  22.   var clic=-1;
  23.   function rien() {
  24.     return;
  25.     }
  26. // structure menu
  27.   function menu(n,l,p) {
  28.     this.nom=n;           // nom du lien
  29.     this.lien=l;          // lien : url
  30.     this.parent=p;        // numero du noeud parent, si -1 pas de noeud parent
  31.     this.nb=0;            // nombre de sous elements
  32.     this.etat=2;          // indique si les sous elements ont étés créés ou non, si nb=0, etat=2
  33.     }                     // si etat!=2, 0 pour liste effacée et 1 pour liste affichée
  34. // supprime tout les espaces present dans une chaine de caratere et les remplace par des  
  35.   function supprime_espace(n) {
  36.     n.replace(/ /g," " );
  37.     return(n);
  38.     }
  39. // ajout d'un element dans le menu
  40. // n : nom à afficher
  41. // l : lien (url)
  42. // p : pere (si -1 se trouve à la racine du menu
  43.   function ajout(n,l,p) {
  44.     var elm=new menu(n,l,p);
  45.     listes[nbl]=elm;
  46.     if (p>-1) {
  47.       listes[p].nb++;
  48.       }
  49.     return(nbl++);
  50.     }
  51. // genere le code html qui va representer le menu
  52.   function creermenu(n) {   
  53.     var s1='<li onClick="mod('+n+')">';
  54.     var s2='<img id=i'+n+' src="'+(listes[n].nb<1?'dc.gif':'bs.gif')+'">';
  55.     if (listes[n].lien=="-" ) var s3=' <a href="javascript:rien()">'+listes[n].nom+'</a>';
  56.       else var s3=' <a href="'+listes[n].lien+'" target="page">'+listes[n].nom+'</a>';
  57.     var s4='<ul id=l'+n+'></ul>';
  58.     return(s1+s2+s3+s4);
  59.     }
  60.   function ini() {
  61.     var lst=document.all.liste;
  62.     var s="";
  63.     for (var i=0;i<nbl;i++) {
  64.       if (listes[i].parent==-1) s+=creermenu(i);
  65.       }
  66.     lst.innerHTML=s;
  67.     }
  68. // création du sous menu d'un noeud n
  69.   function sousmenu(n) {
  70.     if (listes[n].nb<1) return;
  71.     var s="";
  72.     for (var i=0;i<nbl;i++) {
  73.       if (listes[i].parent==n) {
  74.         s+=creermenu(i);
  75.         }
  76.       }
  77.     return(s); 
  78.     }
  79.    
  80. // gestion du clic sur un noeud : initialisation+ouverture et fermeture   
  81.   function mod(n) {
  82.    // traitement du clic multiple
  83.     if (n==clic) {
  84.       clic=listes[n].parent;
  85.       return;
  86.       }
  87.     clic=listes[n].parent; 
  88.    // si ok  
  89.     if (listes[n].nb<1) return;
  90.     if (listes[n].etat==2) {
  91.       eval('document.all.l'+n+'.innerHTML=sousmenu(n)');
  92.       listes[n].etat=0;
  93.       }
  94.     if (listes[n].etat==0) {
  95.       eval('document.all.l'+n+'.style.display="block"');     
  96.       eval('document.all.i'+n+'.src="bo.gif"');     
  97.       }
  98.     else {
  99.       eval('document.all.l'+n+'.style.display="none"');     
  100.       eval('document.all.i'+n+'.src="bs.gif"');     
  101.       }
  102.     listes[n].etat=(listes[n].etat+1)&1;
  103.     }
  104. // generation du menu à l'aide de la fonction ajout
  105. [...]
  106. // affichage du menu, uniquement les noeuds racine
  107.   ini();
  108. </script>
  109. </body>
  110. </html>

n°29771
darkoli
Le Petit Dinosaure Bleu
Posté le 07-05-2001 à 20:40:54  profilanswer
 

par exemple pour créer un menu contenant les jours de la semaine, il fau ecrire à la place [...] tout en bas :
 
  tmp=ajout("jours","-",-1);
  ajout("lundi","-",tmp);
  ajout("mardi","-",tmp);
  ajout("mercredi","-",tmp);
  ajout("jeudi","-",tmp);
  ajout("vendredi","-",tmp);
  ajout("samedi","-",tmp);
  ajout("dimanche","-",tmp);  
 
=> les jours (lundi..dimanche) sont des sous menus de "jours"

n°29960
petoulachi
A fortiori, brigadier chef
Posté le 09-05-2001 à 09:28:16  profilanswer
 

Ok merci Darkoli je vais me pencher dessus. Si j'apporte des ameliorations, ça t'interesse ?
 
 :jap:  En tout cas merci tous les  !  :jap:

n°29966
petoulachi
A fortiori, brigadier chef
Posté le 09-05-2001 à 09:42:48  profilanswer
 

Juste deux ptites questions ;
a quoi ça sert de faire '+n+' ? par exemple: mod('+n+') ??
et sinon je crois que supprime_espace n'a rien a faire ici :)

n°30014
darkoli
Le Petit Dinosaure Bleu
Posté le 09-05-2001 à 12:09:04  profilanswer
 

petoulachi a écrit a écrit :

Juste deux ptites questions ;
a quoi ça sert de faire '+n+' ? par exemple: mod('+n+') ??
et sinon je crois que supprime_espace n'a rien a faire ici :)




 
oui tu peux virer supprime espace : je l'avais mise car il y avait un probleme au debut. En effet si le nom des menu est long et qu'ils sont plus grand que la largeur de la frame, le nom et coupé et ecris sur plusieurs lignes :
 

Code :
  1. :D Nom du menu 1 qui
  2.   est un peu trop long
  3. :D Menu2


 
et c'est pas géniale, en remplacant les espaces (' ', coe ascii 32) par   il n'y a plus de retour automatique à la ligne.
 

Code :
  1. :D Nom du menu 1 qui est un peu ... [caché par le bord de la frame]
  2. :D Menu2


 
donc la fonction supprime_espcae remplacait les ' ' par ' ' mais en fait il existe une methode encore plus simple.
 
Il suffit d'utiliser la balise PRE.
 

Code :
  1. <pre>
  2. <ul ...>
  3. [...
  4. </ul>
  5. </pre>


 
et la il n'ya plus de retour à la ligne automatique car la mise en page d'origine est conservée.

n°30015
petoulachi
A fortiori, brigadier chef
Posté le 09-05-2001 à 12:11:09  profilanswer
 

Tiens c bizarre ton code genere une erreur etrange. Lorsque je load la page, il me donne une erreur javascript : "les donnees necessaires pour achever cette operation ne sont pas encore disponible".
cette erreur se passe dans la fonction ini;

Code :
  1. function ini() {
  2.     var lst=document.all.liste;
  3.     var s="";
  4.     for (var i=0;i<nbl;i++) {
  5.       if (listes[i].parent==-1) s+=creermenu(i);
  6.       }
  7.     lst.innerHTML=s;
  8.     }


lorsque tu fais :
lst.innerHTML=s;
 
et je comprend pas pourquoi ? :??:

n°30016
petoulachi
A fortiori, brigadier chef
Posté le 09-05-2001 à 12:12:09  profilanswer
 

ok compris, je connaissais pas <pre> :)

n°30018
darkoli
Le Petit Dinosaure Bleu
Posté le 09-05-2001 à 12:14:57  profilanswer
 

petoulachi a écrit a écrit :

Juste deux ptites questions ;
a quoi ça sert de faire '+n+' ? par exemple: mod('+n+') ??
et sinon je crois que supprime_espace n'a rien a faire ici :)




 
si c'est du '+n+' qui est la dont tu parle :  
  eval('document.all.l'+n+'.innerHTML=sousmenu(n)');
             
eval va interpreter le code qui est donné en parametre. Chaque element du menu a un numero propre et une liste associée dont le nom est 'l'+n ou n est le numero de l'element.
 
donc pour acceder directement a une liste ou modifier ses parametre, j'utilise cette methode.
 
 
si tu fait des amelioration y'a pas de problem tu peux me les filer.

n°30077
petoulachi
A fortiori, brigadier chef
Posté le 09-05-2001 à 14:26:38  profilanswer
 

non je voulais pas parler de ça, mais plutot pourquoi tu encadres ta variable de '+ +',par exemple dans :
var s1='<li onClick="mod('+n+')">';
je vois pas pourquoi tu fais pas mod(n) directement.
Sinon tu n'as pas l'URL du site qui utilise ce script ?

n°30183
darkoli
Le Petit Dinosaure Bleu
Posté le 09-05-2001 à 20:26:34  profilanswer
 

petoulachi a écrit a écrit :

non je voulais pas parler de ça, mais plutot pourquoi tu encadres ta variable de '+ +',par exemple dans :
var s1='<li onClick="mod('+n+')">';
je vois pas pourquoi tu fais pas mod(n) directement.
Sinon tu n'as pas l'URL du site qui utilise ce script ?




 
simplement si je fais mod(n), le code HTML ecris sera mod(n) alors le parametre transmis par la fonction ne correspond a rien.
 
pour chaque liste li, il faut que je sache sur laquelle l'utilisateur a cliqué, c'est pourquoi en parametre de la fonction mod je mets le numero de la liste.
 
code HTML pour le 18° par exemple :
  <li onClick="mod(18)">  
 
pour le creer en javascript (n=18) (en gras la chaine de caracteres) :
  var s1='<li onClick="mod('+n+')">';

n°30246
petoulachi
A fortiori, brigadier chef
Posté le 10-05-2001 à 09:39:27  profilanswer
 

ok ok . en fait, tu fait un transtypage avec '+ +', comme en java quoi ....
sinon he bin ton script je vais devoir le changer, en fait pour etre precis je ne vais pas pouvoir garder gd chose de ton script. En effet, tu utilises la propriete innerHTML,propre a IE et qui bien sur n'est pas presente sur netscape. Je ne peux donc pas ecrire du code HTML entre 2 balises tel que tu le fais (ou alors on me l'a caché ?  :crazy:  ). Donc en gros, je garde un peu le meme systeme pour la structure, mais ensuite l'ecriture du code je vais tout reprendre ...
En tout cas merci pour l'interet que tu me portes, ça me fait plaisir !  :jap:

n°30363
darkoli
Le Petit Dinosaure Bleu
Posté le 10-05-2001 à 12:19:19  profilanswer
 

ou ce que tu peux faire c'est ne pas le faire en dynamique mais créer deja tout le menu des le depart.

n°30408
petoulachi
A fortiori, brigadier chef
Posté le 10-05-2001 à 14:12:27  profilanswer
 

Comment ça ?

n°30508
darkoli
Le Petit Dinosaure Bleu
Posté le 10-05-2001 à 20:17:31  profilanswer
 

petoulachi a écrit a écrit :

Comment ça ?




 
en gros il ne faut pas utiliser innerHTML pour créer le menu mais le créer une fois pour toute des le depart.
 
En fait le programme que j'ai fait ne va pas tout genere des le depart. Il ne va creer les sous menu que juste avant qu'il soit ouvert pour la premiere fois. Mais les sous menu peuvent tous etre créé des le depart se qui evite d'avoir à utiliser innerHTML.

n°30726
petoulachi
A fortiori, brigadier chef
Posté le 11-05-2001 à 14:05:34  profilanswer
 

ouais c ce que je comptait faire... de toute façon, je vois pas trop comment je pourrai faire autrement, a cause de ce netscape...
En gros, on declare le menu, et il est construit de suite. apres on ne peut plus le changer (ou alors il faut reloader la page)

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation

  [Webmaster] Besoin de vos experiences ....

 

Sujets relatifs
Besoin d'info sur les fichiers *.sysbesoin d'idee de programme en C pour un debutant.....
[SQL]Besoin de conseilsbesoin d'aide base access
[SQL Server] besoin d'aide pour requete de majBesoin d'aide sur compilateur mingw...
besoin d'aide[PHP] besoin d aide COKIES
[JavaScript] besoin d'aide !Ca urge, j'ai besoin d'un puissance 4 en pascal avec l'IA
Plus de sujets relatifs à : [Webmaster] Besoin de vos experiences ....


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR