Probleme d'affichage menu java + CSS

[Résolu]
Signaler
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011
-
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
-
Bonjour

j'ai un problème d'affichage d'un menu java sur une page php ...  le code d'affichage du menu est celui ci :

          ----

            ,
            <!--sous menu 1 : demarrer -->
             

                <table border="0" cellspacing="0" cellpadding="0">
                  ----

                   , </td>
                 
                  ----

                    ,
                   
[imaginez.html ]</td>
           
<td>[# ]</td>
            <td>[maitrisez.html ]</td>
            <td>[# ]</td>
            <td>&nbsp;</td>
          </tr>
        </table>

et la fonction javascript et celle ci

var disappeardelay=250  //menu disappear speed onMouseout (in miliseconds)
var enableanchorlink=0 //Enable or disable the anchor link when clicked on? (1=e, 0=d)
var hidemenu_onclick=1 //hide menu when user clicks within menu? (1=yes, 0=no)

/////No further editting needed

var ie5=document.all
var ns6=document.getElementById&&!document.all

function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}

function showhide(obj, e, visible, hidden){
if (ie5||ns6)
dropmenuobj.style.left=dropmenuobj.style.top=-1000
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}

function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var
windowedge=ie5 && !window.opera?
iecompattest().scrollLeft+iecompattest().clientWidth-18:
window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie5 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var
windowedge=ie5 && !window.opera?
iecompattest().scrollTop+iecompattest().clientHeight-18 :
window.pageYOffset+window.innerHeight-15
dropmenuobj.contentmeasure=dropmenuobj.offsetHeight
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHeight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}

function dropdownmenu(obj, e, dropmenuID){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
if (typeof dropmenuobj!="undefined") //hide previous menu
dropmenuobj.style.visibility="hidden"
clearhidemenu()
if (ie5||ns6){
obj.onmouseout=delayhidemenu
dropmenuobj=document.getElementById(dropmenuID)
if (hidemenu_onclick) dropmenuobj.onclick=function(){dropmenuobj.style.visibility='hidden'}
dropmenuobj.onmouseover=clearhidemenu
dropmenuobj.onmouseout=ie5? function(){ dynamichide(event)} : function(event){ dynamichide(event)}
showhide(dropmenuobj.style, e, "visible", "hidden")
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}

function clickreturnvalue(){
if ((ie5||ns6) && !enableanchorlink) return false
else return true
}

function contains_ns6(a, b) {
while (b.parentNode)if ((b b.parentNode) a)
return true;
return false;
}

function dynamichide(e){
if (ie5&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}

function delayhidemenu(){
delayhide=setTimeout("dropmenuobj.style.visibility='hidden'",disappeardelay)
}

function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)


et la definition de la DIV menu java ...  #menujava  {position: absolute; left: 275px; top: 150px; }
 
pour voir ce que cela fait à l'éran http://dev.entreprenez.fr/thema.php

je suis nul en javascript et là je patoge depuis 3 heures alors que je suis sure que c'est une connerie ...

merci de votre précieuse aide ...

11 réponses

Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Je regarderai plus en avant à mon retour...
Le talent c'est toi qui l'a tu as fait cela en 3 mn, je vais être en avance..
PS: Penses à accepter la réponse au cas ou cela intéresse d'autres forumeux...
;0))
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
B
onjour...
tu n'as pas forcement choisi un menu facile à maintenir mais bon

les images servant au suvol pour faire apparaître les sous menus doivent se situer en tête de la table

<table border= "0" cellspacing="0" cellpadding="0">
  <tr>
    <td>&nbsp;</td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td>&nbsp;</td>
  </tr>
ensuite tu mets le reste...



  <tr>
    <td></td>
    <td class = "sousmenu" ><!--sous menu 1 : demarrer -->
   

...etc ...
tu noteras au passage l'affectation d'une class sur les TD contenant les DIVs sous menus...

donc il faut créer une classe sousmenu
td.sousmenu{
  vertical-align:top;
  text-align:left;
}

il faut que le style anylinkcss soit défini comme suit
.anylinkcss{
  visibility: hidden;
  z-index: 100;
}
et pour finir dans la fonction
function dropdownmenu(obj, e, dropmenuID){

tu mets en commentaire les lignes
/* ne servent plus à rien
dropmenuobj.x =getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top =dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
*/

cela devrait être tout OUF...
;0)
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011

merci merci ... ca marche super mais comment je peux faire pour faire en sorte que les onglets soient plus rapprochés ????????
http://dev.entreprenez.fr/thema.php
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Alors la ReChangement de technique, je dois admettre que je m'en douté

1/ il fauit déplacer tout tes DIVs class="anylinkcss" en dehors de la table

2/ retablir le style
.anylinkcss{
  position:absolute;
  visibility: hidden;
  z-index: 100;
}

du coup le style td.sousmenu ne sert plus à rien
<strike>td.sousmenu{
  vertical-align:top;
  text-align:left;
}
</strike>
3/ Les lignes en commentaires dans la fonction
function dropdownmenu(obj, e, dropmenuID){
doivent être réactivées

cela devrait fonctionner...
;0)
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011

bon alors j'ai fais les modis mais ca ne marche pas comme je veux ... j'ai pas du faire ce qu'il fallait ...
pour voir le résultat http://dev.entreprenez.fr/thematique.php

je sais plus comment faire ...

merci de ton aide ...
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
ton fichier style inc/anylink.css

.anylinkcss{
  visibility: hidden;
  z-index: 200;
  podistion: absolute;
}
position serait plus mieux bien...

;0)
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011

rhoo la la ... bon je viens de changer ... heuresuement que tu corriges ! :-)
mais ca marche pas beaucoup mieux .. je dois ne laisser que les div ?
je ne fais pas un tableau avec toutes les div anylinkmenu ?
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Attention


les DIVs ne doivent pas être encapsuler dans le DIV







;0)
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011

bon on remonte :-) mais je ne sais toujours pas comment les mettre sous les menu .. est ce qu'il faut que je les place comme un div normal avec un left et un top ?
Messages postés
3426
Date d'inscription
lundi 26 décembre 2005
Statut
Membre
Dernière intervention
14 janvier 2011
18
Excuses mets les entre le
et pour ne pas prendre en compte le DIV global
Autres excuses je pars pour le week-end alors tu as 5 mn...SINON ?? 






;0)))
Messages postés
95
Date d'inscription
dimanche 8 janvier 2006
Statut
Membre
Dernière intervention
7 avril 2011

Quel talent .... merci beaucoup ... et bon week end à toi ... !!!! :-)