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

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML,JS] ........HELP ME PLEASE Je vais devenir dingue...........

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[HTML,JS] ........HELP ME PLEASE Je vais devenir dingue...........

n°179775
mkracing66
Posté le 22-07-2002 à 10:45:32  profilanswer
 

Salut a tous,
je voudrais faire un menu deroulant pour une toolbar horizontale.
 
Je m explique, g fait un tableau de 1 ligne et dans chaque cellule g applique une image.
De plus, g mis un petit bout de JS pour faire du rollover (action onMouseOver du lien de l image).
 
Maintenant je voudrais faire un menu deroulant pourchque cellule mais je n y arrive pas.... :'(
 
G trouve un script plutot pas mal ki selon le nom de la class faisait une action (pour differencier la cellule menu de l item du menu).
Ce script marche nickel je l ais teste mais pas pour mon application :fou:
Il marche pour une cellule de tableau avec du texte mais des que je mets mon image vlan plus rien ne marche comme si il ne detectait pas l objet faisant appel au JSscript pour afficher le menu :eek2:
 
Je ne comprends pas help me please si vous savez resoudre ce pb ou si vous avez une autre solution pour faire ce menu deroulant avec image en rollover... :'( :'( :'( :'( :'(

mood
Publicité
Posté le 22-07-2002 à 10:45:32  profilanswer
 

n°179782
Toucouch
Posté le 22-07-2002 à 10:57:10  profilanswer
 

Si j'ai bien compris, tu veux faire des menus déroulants personnalisés sans utiliser la balise <select>, c'est ça?
 
Donc je pense que tu dois utiliser des <div>, non?
 
Mais déjà, pour commencer, si tu veux qu'on t'aide à comprendre ce qui foire dans ton script, 'faudrait peut-être commencer par le mettre dans ton post, non?

n°179788
mkracing66
Posté le 22-07-2002 à 11:03:50  profilanswer
 

Voila le script appele :
 

Code :
  1. function MenuEffets() {
  2.         var cls = event.srcElement.className;
  3.         var isClassContainer = cls == "td_furtif";
  4.         var isClassPopup = cls == "menu_deroulant";
  5.         var isClassMenuitem = cls == "objet_du_menu";
  6.         if (isClassContainer) {
  7.             if (event.type == "mouseover" )
  8.                 event.srcElement.all(0).style.display = "block";
  9.             else {
  10.                  if (!event.fromElement.contains(event.toElement))
  11.                     event.srcElement.all(0).style.display = "none";
  12.             }
  13.         }
  14.         if (isClassPopup) {
  15.             if (event.type == "mouseout" && !event.fromElement.contains(event.toElement)){
  16.   event.srcElement.style.display = "none";
  17.  }
  18.         }
  19.         if (isClassMenuitem) {
  20.             if (event.type == "mouseover" ) {
  21.                 event.srcElement.style.color = couleur_police_rollover;
  22.                 event.srcElement.style.backgroundColor = couleur_fond_rollover;
  23.             }
  24.             else {
  25.                 event.srcElement.style.color = couleur_police;
  26.                 event.srcElement.style.backgroundColor = couleur_fond;
  27.                 if (!event.fromElement.parentElement.parentElement.parentElement.parentElement.contains(event.toElement))
  28.                     event.srcElement.parentElement.parentElement.parentElement.style.display = "none";
  29.             }
  30.         }
  31.     }
  32.     //var maintenant = New Date();
  33.     //var sec = maintenant.getTime();  
  34.     document.onmouseover = MenuEffets;
  35.     document.onmouseout = MenuEffets;
  36.     document.write('<STYLE>');
  37.     document.write('.menu {font-family: Verdana, Arial, Helvetica, Tahoma, MS Sans Serif;');
  38.     document.write('          font-size: '+ taille_police +'pt;');
  39.     document.write('          color: '+ couleur_police +';');
  40.     document.write('          cursor: default; }');
  41.     document.write('.menu_deroulant {position: absolute;');
  42.     document.write('        display: none;');
  43.     document.write('        border-collapse: collapse;');
  44.     document.write('        border-style: solid;');
  45.     document.write('        border-width: 1px;');
  46.     document.write('        border-color: '+ couleur_bordure + ';');
  47.     document.write('        background-color: '+ couleur_fond + ';');
  48.     document.write('        width: '+ taille_menu_deroule +'px;');
  49.     document.write('        left: expression(this.parentElement.offsetLeft + 10);');
  50.     document.write('        top: expression((this.parentElement.parentElement.parentElement.parentElement.offsetTop + this.parentElement.parentElement.parentElement.parentElement.offsetHeight-3) );');
  51.     document.write('        font-family: Verdana, Arial, Helvetica, Tahoma, MS Sans Serif;');
  52.     document.write('        font-size: '+taille_police+'pt;');
  53.     document.write('        color: '+ couleur_police +'; }');
  54.     document.write('.objet_du_menu {border-style: solid;');
  55.     document.write('           border-width: 0px;');
  56.     document.write('           border-color: '+ couleur_bordure +';');
  57.     document.write('           cursor: hand; }');
  58.     document.write('.td_furtif {');
  59.     document.write('        border-style: solid;');
  60.     document.write('           border-width: 1px;');
  61.     document.write('           border-color: '+ couleur_bordure +';');
  62.     document.write('           background-color: '+ couleur_fond +';');
  63.     document.write('           cursor: hand; }');
  64.     document.write('</STYLE>');


 
et voici le code de mon premier bouton que je voudrais avoir en menu deroulant mais il ne reconnait pas la class ou se trouve mon image (si je la vire ca marche :fou: ) :
 

Code :
  1. <table class="menu" border="1" cellspacing="0" width="800" id="AutoNumber2" height="30" bordercolor="#000000" style="border-collapse: collapse; " cellpadding="0">
  2.     <td class="td_furtif" width="50" height="30" bgcolor="#0000A6" bordercolor="#000000" style="border-left-style: solid; border-left-width: 1; border-top-style: solid; border-top-width: 1; border-bottom-style: solid; border-bottom-width: 1"> </td>
  3.     <td class="td_furtif" width="100" height="30" bgcolor="#0000A6" bordercolor="#000000" style="border-top-color: #000000; border-top-width: 1; border-bottom-color: #000000; border-bottom-width: 1; border-left-style:solid; border-left-width:1" align="center">
  4.     <p align="center">
  5.     <a href="index.htm"
  6.     onMouseOver="pic_home.src='images/Home_Down.gif';MenuEffets;"
  7.     onMouseOut="pic_home.src='images/Home_Up.gif'">
  8.     <img name="pic_home" border="0" src="images/Home_Up.gif" width="100" height="30"></a>
  9.    
  10.      <TABLE CLASS="menu_deroulant">
  11.             <TR><TD CLASS="objet_du_menu" onClick="javascript:window.location='http://www.adresse.com/'">Nouveau Message</TD></TR>
  12.             <TR><TD CLASS="objet_du_menu" onClick="javascript:window.location='http://www.adresse.com/'">Lire Un Message</TD></TR>
  13.             <TR><TD CLASS="objet_du_menu" onClick="javascript:window.location='http://www.adresse.com/'">Répondre</TD></TR>
  14.         </TABLE>
  15. </td>

n°179792
mkracing66
Posté le 22-07-2002 à 11:05:20  profilanswer
 

Arf g oublie de virer l appel au menu effect dans le onmouseover du lien de l image c etait pour faire un test mais ca ne marche pas non plus...

n°179873
mkracing66
Posté le 22-07-2002 à 12:16:43  profilanswer
 

Le truc que j aimerais savoir c si dans le script il fait la recup du nom de la class avec le event.srcElement.className ben POURQUOI CA NE FCT PAS SI JE MET CLASS="LE NOM Q U IL FAUT " DANS LE LIEN DE MON IMAGE OU SE TROUVE LES APPELS D EVENEMENTS ONMOUSEOVER ETC...
 

n°180060
mkracing66
Posté le 22-07-2002 à 16:07:21  profilanswer
 

Aller Up !
 
Aller une petite suggestion n ayez pas peur je suis suffisemment desespere pour prendre n importe quelle reponse histoire de bosser un peu....
 
C vraimnet le merdier le JS :fou:


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

  [HTML,JS] ........HELP ME PLEASE Je vais devenir dingue...........

 

Sujets relatifs
2 petites questions Html/php ou autresCOMMENT FAITES VOUS ??? je vais devenir dingue avec ces tableaux !!!!
[HTML, JS]Eviter l'effet mosaique sur une petite image ? [resolu]Une page html dans un tableau?
HTMLtraduire un script PHP en ASP - Help
traduire un script PHP en ASP - HelpPhP ou Html ou autre ? si on veut apprendre un truc pérène...
Plus de sujets relatifs à : [HTML,JS] ........HELP ME PLEASE Je vais devenir dingue...........


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