Sujet Précédent Sujet Suivant

Probleme d'affichage menu java + CSS

Résolu
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011 - 9 mars 2007 à 14:14
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 - 9 mars 2007 à 18:44
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

Réponse 1 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 18:44
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))
3
Réponse 2 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 15:26
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)
0
Réponse 3 / 11
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011
9 mars 2007 à 15:46
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
0
Réponse 4 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 16:33
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)
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 11
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011
9 mars 2007 à 18:12
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 ...
0
Réponse 6 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 18:18
ton fichier style inc/anylink.css

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

;0)
0
Réponse 7 / 11
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011
9 mars 2007 à 18:24
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 ?
0
Réponse 8 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 18:30
Attention


les DIVs ne doivent pas être encapsuler dans le DIV







;0)
0
Réponse 9 / 11
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011
9 mars 2007 à 18:33
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 ?
0
Réponse 10 / 11
PetoleTeam Messages postés 3426 Date d'inscription lundi 26 décembre 2005 Statut Membre Dernière intervention 14 janvier 2011 17
9 mars 2007 à 18:38
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)))
0
Réponse 11 / 11
cs_loupile Messages postés 95 Date d'inscription dimanche 8 janvier 2006 Statut Membre Dernière intervention 7 avril 2011
9 mars 2007 à 18:42
Quel talent .... merci beaucoup ... et bon week end à toi ... !!!! :-)
0

Discussions similaires

menu en c
sebz10 -
decricri62 -

4 réponses
comment créer un sous menu
msi79 -
msi79 -

8 réponses
CSS MAP et AREA
gabs77 -
gabs77 -

9 réponses
trier un iterator
lafolle24320 -
Twinuts -

9 réponses
la division en java
cs_aliomar -
KIRAIII -

3 réponses
Rejoignez-nous