Sujet Précédent Sujet Suivant

Probleme de onmouseover onmouseout avec gestion event.observe

cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010 - 1 avril 2009 à 16:20
cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010 - 1 avril 2009 à 19:37
Bonjour,

Voila mon problème pour ceux qui pourrait peut être me filer un ptit coup de main.

Je ne suis pas expert, j'apprend à la volée donc n'hésitez pas à me faire autant de remarque que nécessaire.

J'ai un menu vertical que j'essaye de faire fonctionner à l'identique d'un menu QuickMenu d'opencube (payant et pas donné en plus) que j'avais utilisé en attendant de le refaire ou de trouver sur le net en opensource (sans succès)

Donc me voici dans la galère avec les events onmouseover et onmouseout.

J'aimerais avoir une meilleur gestion des evenements afin de pouvoir afficher un sous menu au passage de la souris sur un des éléments du menu(div), le garder actif durant le temps de selection du lien dans la zone du sousmenu (ul), et l'enrouler au changement de zone d'un menu sur un autre(changement de div) ainsi que le fermer lorsque l'internaute quitte toutes les zones du menu (div des menu et ul des sous menu) et ainsi de suite.

J'espère avoir été clair, voici le code de la page.

<hr size="2" width="100%" />

<script type="text/javascript">

var Categories = ['societe','telechargement','concepts','marketing'];

function Expand_CurrentMenu(indic){

    var CurrentCategorie = document.getElementById('menu_' + indic);

    var CurrentSousCategorie = document.getElementById('conteneur_' + indic);

    if(CurrentSousCategorie.style.display == 'none'){

        if (indic != 'societe') {

            if(document.getElementById('menu_societe').className == 'menuhaut_ouvert'){

                document.getElementById('menu_societe').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_societe', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'telechargement') {

            if(document.getElementById('menu_telechargement').className == 'menuhaut_ouvert'){

                document.getElementById('menu_telechargement').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_telechargement', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'concepts') {

            if(document.getElementById('menu_concepts').className == 'menuhaut_ouvert'){

                document.getElementById('menu_concepts').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_concepts', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'marketing') {

            if(document.getElementById('menu_marketing').className == 'menuhaut_ouvert'){

                document.getElementById('menu_marketing').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_marketing', { duration: 0.3, queue: 'end'});

            }

        }

       

        new Effect.SlideDown('conteneur_' + indic, { duration: 0.3, queue: 'end'});

        CurrentCategorie.className = 'menuhaut_ouvert';

        Actualmenu = indic;

    }

    /*else {

        CurrentCategorie.className = 'menuhaut_ferme';

        new Effect.SlideUp('conteneur_' + indic, { duration: 0.3, queue: 'end'});   

        ActualMenu = '';

    }*/

}

function Collapse_Menu(){

            if(document.getElementById('menu_societe').className == 'menuhaut_ouvert'){

                document.getElementById('menu_societe').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_societe', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_telechargement').className == 'menuhaut_ouvert'){

                document.getElementById('menu_telechargement').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_telechargement', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_concepts').className == 'menuhaut_ouvert'){

                document.getElementById('menu_concepts').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_concepts', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_marketing').className == 'menuhaut_ouvert'){

                document.getElementById('menu_marketing').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_marketing', { duration: 0.3, queue: 'end'});

            }

}

document.observe('dom:loaded',function(){

        $('menu_societe').observe('mouseover',function(event){

            Expand_CurrentMenu('societe');

            event.stop();

        });

       

        $('menu_telechargement').observe('mouseover',function(event){

            Expand_CurrentMenu('telechargement');

            event.stop();

        });

        $('menu_concepts').observe('mouseover',function(event){

            Expand_CurrentMenu('concepts');

            event.stop();

        });

        $('menu_marketing').observe('mouseover',function(event){

            Expand_CurrentMenu('marketing');

            event.stop();

        });

       

});

</script>

<style type="text/css">

#menu {

    width:630px;

    height:55px;

    position:relative;

    background-color:transparent;

    font:1em/1em Helvetica, Arial, sans-serif;

    font-style:normal;

    }

#menu div a {

    color:#FFFFFF;

    font-size:1em;

    text-decoration:none;

    }

#menu div a:link {

    color:#FFFFFF;

    font-size:1em;

    text-decoration:none;

    }

#menu div a:hover {

    color:#CCCCCC;

    font-size:1em;

    text-decoration:none;

    }

#menu div a:active {

    color:#FFFFFF;

    font-size:1em;

    text-decoration:none;

    }               

#menu div a:selected {

    color:#FFFFFF;

    font-size:1em;

    text-decoration:none;

    }

       

#menu_accueil {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width: 55px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_societe {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:55px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_concepts {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:75px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_marketing {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:60px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_telechargement {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:105px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_videos {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:45px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

#menu_contact {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    width:95px;

    font-variant: small-caps;

    z-index:99999;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

    cursor:pointer;

    }

   

#conteneur_societe {

    width:130px;

    height:auto;

    position:absolute;

    padding:10px;

    top:40px;

    left:0px;

    background-color: #000000;

    opacity:0.9;

    z-index:99999;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    cursor:pointer;

    }

   

#conteneur_concepts {

    width:110px;

    height:auto;

    position:absolute;

    padding:10px;

    top:40px;

    left:0px;

    background-color: #000000;

    opacity:0.9;

    z-index:99999;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    cursor:pointer;

    }

#conteneur_marketing {

    width:245px;

    height:auto;

    position:absolute;

    padding:10px;

    top:40px;

    left:0px;

    background-color: #000000;

    opacity:0.9;

    z-index:99999;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    cursor:pointer;

    }

#conteneur_telechargement {

    width:105px;

    height:auto;

    position:absolute;

    padding:10px;

    top:40px;

    left:0px;

    background-color: #000000;

    opacity:0.9;

    z-index:99999;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    cursor:pointer;

    }

.global_item {

    height:auto;

    width:auto;

    margin:0px 0px 5px 5px;

    }

</style>

 


    [<?php echo $lang. Accueil/"

    title="<?php echo $menu_accueil_desc; ?>"><?php echo $menu_accueil; ?>]

   

 


    [<?php echo $lang. Accueil/societe/"

    title="<?php echo $menu_societe_desc; ?>"><?php echo $menu_societe; ?>]

     

          <li class="global_item"> [<?php echo $lang. Accueil/societe/actualite/"

            title="<?php echo $menu_societe_actualite_desc; ?>"><?php echo $menu_societe_actualite; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/societe/historique/"

            title="<?php echo $menu_societe_historique_desc; ?>"><?php echo $menu_societe_historique; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/societe/organigramme/"

            title="<?php echo $menu_societe_organigramme_desc; ?>"><?php echo $menu_societe_organigramme; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/societe/implantation/"

            title="<?php echo $menu_societe_implantation_desc; ?>"><?php echo $menu_societe_implantation; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/societe/reseau/"

            title="<?php echo $menu_societe_reseau_desc; ?>"><?php echo $menu_societe_reseau; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/societe/marques/"

            title="<?php echo $menu_societe_marques_desc; ?>"><?php echo $menu_societe_marques; ?>] </li>

     

 

 
[<?php echo $lang. Accueil/concepts/"

    onclick="return false;"

    title="<?php echo $menu_concepts_desc; ?>"><?php echo $menu_concepts; ?>]

   

        <li class="global_item"> [<?php echo $lang. Accueil/concepts/peintre/"

            title="<?php echo $menu_concepts_peintre_desc; ?>"><?php echo $menu_concepts_peintre; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/concepts/plaquiste/"

            title="<?php echo $menu_concepts_plaquiste_desc; ?>"><?php echo $menu_concepts_plaquiste; ?>] </li>

     

 

 
[<?php echo $lang. Accueil/marketing/"

    onclick="return false;"

    title="<?php echo $menu_marketing_desc; ?>"><?php echo $menu_marketing; ?>]

     

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/lineaires/"

            title="<?php echo $menu_marketing_lineaires_desc; ?>"><?php echo $menu_marketing_lineaires; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/valisettes/"

            title="<?php echo $menu_marketing_valisettes_desc; ?>"><?php echo $menu_marketing_valisettes ?> ] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/catalogues/"

            title="<?php echo $menu_marketing_catalogues_desc; ?>"><?php echo $menu_marketing_catalogues; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/presentoirs/"

            title="<?php echo $menu_marketing_presentoirs_desc; ?>"><?php echo $menu_marketing_presentoirs; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/decoporte/"

            title="<?php echo $menu_marketing_decoporte_desc; ?>"><?php echo $menu_marketing_decoporte; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/box/"

            title="<?php echo $menu_marketing_box_desc; ?>"><?php echo $menu_marketing_box; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/marketing/echantillonneurs/"

            title="<?php echo $menu_marketing_echantillonneurs_desc; ?>"><?php echo $menu_marketing_echantillonneurs; ?>] </li>

     

 

 
[<?php echo $lang. Accueil/telechargement/"

    onclick="return false;"

    title="<?php echo $menu_telechargement_desc; ?>"><?php echo $menu_telechargement; ?>]

     

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/catalogues/"

            title="<?php echo $menu_telechargement_catalogues_desc; ?>"><?php echo $menu_telechargement_catalogues; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/fiches_techniques/"

            title="<?php echo $menu_telechargement_fiches_techniques_desc; ?>"><?php echo $menu_telechargement_fiches_techniques; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/fiches_securite/"

            title="<?php echo $menu_telechargement_fiches_securite_desc; ?>"><?php echo $menu_telechargement_fiches_securite; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/modes_emploi/"

            title="<?php echo $menu_telechargement_modes_emploi_desc; ?>"><?php echo $menu_telechargement_modes_emploi; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/notices_montage/"

            title="<?php echo $menu_telechargement_modes_emploi_desc; ?>"><?php echo $menu_telechargement_modes_emploi; ?>] </li>

          <li class="global_item"> [<?php echo $lang. Accueil/telechargement/pieces_detachees/"

            title="<?php echo $menu_telechargement_pieces_detachees_desc; ?>"><?php echo $menu_telechargement_pieces_detachees; ?>] </li>

     

 

 
[<?php echo $lang. Accueil/videos/"

    title="<?php echo $menu_videos_desc; ?>"><?php echo $menu_videos; ?>]

 
[<?php echo $lang. Accueil/contact/"

    title="<?php echo $menu_contact_desc; ?>"><?php echo $menu_contact; ?>]

 

<hr size="2" width="100%" />
Merci à tous ceux qui aurait un peu d'aide à m'apporter.

7 réponses

Réponse 1 / 7
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
1 avril 2009 à 16:31
Bonjour,

>>gestion des evenements afin de pouvoir afficher un sous menu au passage de la souris

à notre époque, ça se fait uniquement en css !
foultitude d'exemples  et  le mien ici

Cordialement [mon Site] [M'écrire] Bul
0
Réponse 2 / 7
cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010
1 avril 2009 à 16:43
Merci de ta réponse Bul3, je regarde ca de suite.

Effectivement, en pure css c mieux si javascript est désactivé ou restreint, mais j'ai à gérer un slide de mes sous menu et ceci ne peut être fait qu'avec javascript, à moins de ne me tromper, ce qui est fort possible.

Peut être aurais-tu une solution à ca.
0
Réponse 3 / 7
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
1 avril 2009 à 16:51
je ne sais pas ce qu'est un slide....
mais... rien n'empêcherait d'ajouter du javascript
         si nécessaire, en plus du css.
0
Réponse 4 / 7
cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010
1 avril 2009 à 18:29
Sur les conseils de Bul3, j'ai refait l'arborescence CSS qui me faisait défaut.

Le résultat est désormais propre. Merci Bul3

Mais voici que je reviens à ma question principale, c'est à dire supplanter css par du javascript afin de réaliser un déroulement vertical de mes ul de sous menu, jutilise actuellement la propriété Effect.slideup et effect.slidedown de scriptaculous. Mais je n'arrive pas à passer par dessus css afin d'effectuer un déroulement et un enroulement propre.

Voici le nouveau code de la page :

<script type="text/javascript">

var Categories = ['societe','telechargement','concepts','marketing'];

function Expand_CurrentMenu(indic){

    var CurrentCategorie = document.getElementById('menu_' + indic);

    var CurrentSousCategorie = document.getElementById('conteneur_' + indic);

    if(CurrentCategorie.className == 'menuhaut_ferme'){

        if (indic != 'societe') {

            if(document.getElementById('menu_societe').className == 'menuhaut_ouvert'){

                document.getElementById('menu_societe').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_societe', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'telechargement') {

            if(document.getElementById('menu_telechargement').className == 'menuhaut_ouvert'){

                document.getElementById('menu_telechargement').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_telechargement', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'concepts') {

            if(document.getElementById('menu_concepts').className == 'menuhaut_ouvert'){

                document.getElementById('menu_concepts').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_concepts', { duration: 0.3, queue: 'end'});

            }

        }

        if (indic != 'marketing') {

            if(document.getElementById('menu_marketing').className == 'menuhaut_ouvert'){

                document.getElementById('menu_marketing').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_marketing', { duration: 0.3, queue: 'end'});

            }

        }

       

        new Effect.SlideDown('conteneur_' + indic, { duration: 0.3, queue: 'end'});

        CurrentCategorie.className = 'menuhaut_ouvert';

        Actualmenu = indic;

    }

    /*else {

        CurrentCategorie.className = 'menuhaut_ferme';

        new Effect.SlideUp('conteneur_' + indic, { duration: 0.3, queue: 'end'});   

        ActualMenu = '';

    }*/

}

function Collapse_Menu(){

            if(document.getElementById('menu_societe').className == 'menuhaut_ouvert'){

                document.getElementById('menu_societe').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_societe', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_telechargement').className == 'menuhaut_ouvert'){

                document.getElementById('menu_telechargement').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_telechargement', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_concepts').className == 'menuhaut_ouvert'){

                document.getElementById('menu_concepts').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_concepts', { duration: 0.3, queue: 'end'});

            }

            if(document.getElementById('menu_marketing').className == 'menuhaut_ouvert'){

                document.getElementById('menu_marketing').className = 'menuhaut_ferme';

                new Effect.SlideUp('conteneur_marketing', { duration: 0.3, queue: 'end'});

            }

}

document.observe('dom:loaded',function(){

        $('menu_societe').observe('mouseover',function(event){

            Expand_CurrentMenu('societe');

            event.stop();

        });

       

        $('menu_telechargement').observe('mouseover',function(event){

            Expand_CurrentMenu('telechargement');

            event.stop();

        });

        $('menu_concepts').observe('mouseover',function(event){

            Expand_CurrentMenu('concepts');

            event.stop();

        });

        $('menu_marketing').observe('mouseover',function(event){

            Expand_CurrentMenu('marketing');

            event.stop();

        });

       

});

</script>

<style type="text/css">

ul.menu {

    list-style-type: none;

    margin : 0;

    padding: 0;

    width:630px;

    height:55px;

    position:relative;

    background-color:transparent;

    font:1em/1em Helvetica, Arial, sans-serif;

    font-style:normal;

    z-index:9999;

}

ul.menu li {

    float:left;

    position:relative;

    padding:15px 5px 22px 15px;

    font-variant: small-caps;

    background-image:url(/img/menu_off.png);

    background-repeat:repeat-x;

}

ul.menu ul {

    position: absolute;

    display: none;

    list-style-type: none;

    margin: 0;

    z-index:10000;

    top:30px;

    left:5px;

    height:auto;

    padding:10px;

    background-color: #000000;

    opacity:0.9;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    cursor:pointer;

}

ul.menu ul li

{

    float: none;

    padding:5px 0px 0px 0px;

}

ul.menu li a:link, ul.menu li a:visited

{

    display: block;

    color: #FFFFFF;

    background-color: transparent;

    margin:0;

    text-decoration: none;

}

ul.menu li a:hover

{

    background-color: #000000;

    opacity:0.9;

    filter:alpha(opacity=90, style=0);

    -moz-border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-opacity:0.9;

    -webkit-opacity:0.9;

    -khtml-opacity:0.9;

    background-image:url(/img/menu_on.png);

    background-repeat:repeat-x;

}

ul.menu li:hover > ul

{ display: block; }

ul.menu a { border:none; }

#menu_accueil {

    width: 55px;

    }

#menu_societe {

    width:55px;

    }

#menu_concepts {

    width:75px;

    }

#menu_marketing {

    width:60px;

    }

#menu_telechargement {

    width:105px;

    }

#menu_videos {

    width:45px;

    }

#menu_contact {

    width:95px;

    }

#conteneur_societe {

    width:130px;

    }

   

#conteneur_concepts {

    width:110px;

    }

#conteneur_marketing {

    width:245px;

    }

#conteneur_telechargement {

    width:105px;

    }

</style>

  <li id="menu_accueil" class="menuhaut_ferme">

    [<?php echo $lang. Accueil/"

    title="<?php echo $menu_accueil_desc; ?>"><?php echo $menu_accueil; ?>]

    </li>

  <li id="menu_societe" class="menuhaut_ferme">

    [<?php echo $lang. Accueil/societe/"

    title="<?php echo $menu_societe_desc; ?>"><?php echo $menu_societe; ?>]

     

          <li> [<?php echo $lang. Accueil/societe/actualite/"

            title="<?php echo $menu_societe_actualite_desc; ?>"><?php echo $menu_societe_actualite; ?>] </li>

          <li> [<?php echo $lang. Accueil/societe/historique/"

            title="<?php echo $menu_societe_historique_desc; ?>"><?php echo $menu_societe_historique; ?>] </li>

          <li> [<?php echo $lang. Accueil/societe/organigramme/"

            title="<?php echo $menu_societe_organigramme_desc; ?>"><?php echo $menu_societe_organigramme; ?>] </li>

          <li> [<?php echo $lang. Accueil/societe/implantation/"

            title="<?php echo $menu_societe_implantation_desc; ?>"><?php echo $menu_societe_implantation; ?>] </li>

          <li> [<?php echo $lang. Accueil/societe/reseau/"

            title="<?php echo $menu_societe_reseau_desc; ?>"><?php echo $menu_societe_reseau; ?>] </li>

          <li> [<?php echo $lang. Accueil/societe/marques/"

            title="<?php echo $menu_societe_marques_desc; ?>"><?php echo $menu_societe_marques; ?>] </li>

     

  </li>

  <li id="menu_concepts" class="menuhaut_ferme"> [<?php echo $lang. Accueil/concepts/"

    onclick="return false;"

    title="<?php echo $menu_concepts_desc; ?>"><?php echo $menu_concepts; ?>]

   

        <li> [<?php echo $lang. Accueil/concepts/peintre/"

            title="<?php echo $menu_concepts_peintre_desc; ?>"><?php echo $menu_concepts_peintre; ?>] </li>

          <li> [<?php echo $lang. Accueil/concepts/plaquiste/"

            title="<?php echo $menu_concepts_plaquiste_desc; ?>"><?php echo $menu_concepts_plaquiste; ?>] </li>

     

  </li>

  <li id="menu_marketing" class="menuhaut_ferme"> [<?php echo $lang. Accueil/marketing/"

    onclick="return false;"

    title="<?php echo $menu_marketing_desc; ?>"><?php echo $menu_marketing; ?>]

     

          <li> [<?php echo $lang. Accueil/marketing/lineaires/"

            title="<?php echo $menu_marketing_lineaires_desc; ?>"><?php echo $menu_marketing_lineaires; ?>] </li>

          <li> [<?php echo $lang. Accueil/marketing/valisettes/"

            title="<?php echo $menu_marketing_valisettes_desc; ?>"><?php echo $menu_marketing_valisettes ?> ] </li>

          <li> [<?php echo $lang. Accueil/marketing/catalogues/"

            title="<?php echo $menu_marketing_catalogues_desc; ?>"><?php echo $menu_marketing_catalogues; ?>] </li>

          <li> [<?php echo $lang. Accueil/marketing/presentoirs/"

            title="<?php echo $menu_marketing_presentoirs_desc; ?>"><?php echo $menu_marketing_presentoirs; ?>] </li>

          <li> [<?php echo $lang. Accueil/marketing/decoporte/"

            title="<?php echo $menu_marketing_decoporte_desc; ?>"><?php echo $menu_marketing_decoporte; ?>] </li>

          <li> [<?php echo $lang. Accueil/marketing/box/"

            title="<?php echo $menu_marketing_box_desc; ?>"><?php echo $menu_marketing_box; ?>] </li>

          <li> [<?php echo $lang. Accueil/marketing/echantillonneurs/"

            title="<?php echo $menu_marketing_echantillonneurs_desc; ?>"><?php echo $menu_marketing_echantillonneurs; ?>] </li>

     

  </li>

  <li id="menu_telechargement" class="menuhaut_ferme"> [<?php echo $lang. Accueil/telechargement/"

    onclick="return false;"

    title="<?php echo $menu_telechargement_desc; ?>"><?php echo $menu_telechargement; ?>]

     

          <li> [<?php echo $lang. Accueil/telechargement/catalogues/"

            title="<?php echo $menu_telechargement_catalogues_desc; ?>"><?php echo $menu_telechargement_catalogues; ?>] </li>

          <li> [<?php echo $lang. Accueil/telechargement/fiches_techniques/"

            title="<?php echo $menu_telechargement_fiches_techniques_desc; ?>"><?php echo $menu_telechargement_fiches_techniques; ?>] </li>

          <li> [<?php echo $lang. Accueil/telechargement/fiches_securite/"

            title="<?php echo $menu_telechargement_fiches_securite_desc; ?>"><?php echo $menu_telechargement_fiches_securite; ?>] </li>

          <li> [<?php echo $lang. Accueil/telechargement/modes_emploi/"

            title="<?php echo $menu_telechargement_modes_emploi_desc; ?>"><?php echo $menu_telechargement_modes_emploi; ?>] </li>

          <li> [<?php echo $lang. Accueil/telechargement/notices_montage/"

            title="<?php echo $menu_telechargement_modes_emploi_desc; ?>"><?php echo $menu_telechargement_modes_emploi; ?>] </li>

          <li> [<?php echo $lang. Accueil/telechargement/pieces_detachees/"

            title="<?php echo $menu_telechargement_pieces_detachees_desc; ?>"><?php echo $menu_telechargement_pieces_detachees; ?>] </li>

     

  </li>

  <li id="menu_videos" class="menuhaut_ferme"> [<?php echo $lang. Accueil/videos/"

    title="<?php echo $menu_videos_desc; ?>"><?php echo $menu_videos; ?>] </li>

  <li id="menu_contact" class="menuhaut_ferme"> [<?php echo $lang. Accueil/contact/"

    title="<?php echo $menu_contact_desc; ?>"><?php echo $menu_contact; ?>] </li>

Merci d'avance.
0

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

Posez votre question
Réponse 5 / 7
Bul3 Messages postés 4933 Date d'inscription samedi 1 juillet 2006 Statut Membre Dernière intervention 2 février 2015 16
1 avril 2009 à 19:20
>> supplanter css par du javascript
>>afin de réaliser un déroulement vertical de mes ul de sous menu
mais pourquoi faire ? si le css le fait ???
0
Réponse 6 / 7
cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010
1 avril 2009 à 19:28
Si seulement c'était pour moi, je me ferais la même reflexion, mais c'est pour un client et donc je dois suivre ses exigences...

Il veut du dynamisme dans les menus par un deroulement et un enroulement visuel, non pas juste l'apparition sans transition provoqué par css.

Je l'ai déja réalisé pour un sous menu listant les catégories de produits, mais c'était vertical sans débordement sur un autre contenu (dans le cas actuel, du flash). Ce qui donne un bel effet de fluidité, il faut l'avouer.

Voilou
0
Réponse 7 / 7
cs_stooff Messages postés 15 Date d'inscription lundi 30 avril 2007 Statut Membre Dernière intervention 19 janvier 2010
1 avril 2009 à 19:37
Voila la source de mes ennui, ce fameux menu d'opencube. (Que je n'aurais jamais, Ô grand jamais du montrer à mon client !!!)

Testez le en local vous verrez bien le résultat, qui peux être beaucoup plus complexe au niveau de la gestion des effets de transitions (dommage que ce soit aussi cher à l'achat, plus de 200$ si je ne m'abuse pour un license pour un site)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head><title>QuickMenu Save Document</title><meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

<!-- *** QuickMenu copyright (c) 2007, OpenCube Inc. All Rights Reserved.

    -QuickMenu may be manually customized by editing this document, or open this web page using

     IE or Firefox to access the visual interface.

-->

<!--%%%%%%%%%%%% QuickMenu Styles [Keep in head for full validation!] %%%%%%%%%%%-->

<style type="text/css">

/*!!!!!!!!!!! QuickMenu Core CSS [Do Not Modify!] !!!!!!!!!!!!!*/

.qmmc .qmdivider{display:block;font-size:1px;border-width:0px;border-style:solid;position:relative;z-index:1;}.qmmc .qmdividery{float:left;width:0px;}.qmmc .qmtitle{display:block;cursor:default;white-space:nowrap;position:relative;z-index:1;}.qmclear {font-size:1px;height:0px;width:0px;clear:left;line-height:0px;display:block;float:none !important;}.qmmc {position:relative;zoom:1;z-index:10;}.qmmc a, .qmmc li {float:left;display:block;white-space:nowrap;position:relative;z-index:1;}.qmmc div a, .qmmc ul a, .qmmc ul li {float:none;}.qmsh div a {float:left;}.qmmc div{visibility:hidden;position:absolute;}.qmmc .qmcbox{cursor:default;display:block;position:relative;z-index:1;}.qmmc .qmcbox a{display:inline;}.qmmc .qmcbox div{float:none;position:static;visibility:inherit;left:auto;}.qmmc li {z-index:auto;}.qmmc ul {left:-10000px;position:absolute;z-index:10;}.qmmc, .qmmc ul {list-style:none;padding:0px;margin:0px;}.qmmc li a {float:none}.qmmc li:hover>ul{left:auto;}#qm0 ul {top:100%;}#qm0 ul li:hover>ul{top:0px;left:100%;}

/*!!!!!!!!!!! QuickMenu Styles [Please Modify!] !!!!!!!!!!!*/

    /* QuickMenu 0 */

    /*"""""""" (MAIN) Container""""""""*/   

    #qm0   

    {

    width:800px;

    height:75px;

    padding:0px;

    margin:0px;

    background-color:transparent;

    }

    /*"""""""" (MAIN) Items""""""""*/   

    #qm0 a   

    {   

        padding:50px 8px 5px 7px;

        color:#FFFFFF;

        font-family:Arial;

        font-size:14px;

        text-decoration:none;

        font-style:normal;

        font-weight:bold;

        text-align:center;

        font-variant:small-caps;

    }

    /*"""""""" (MAIN) Hover State""""""""*/   

    #qm0 a:hover   

    {   

        color:#BFC1C0;

    }

    /*"""""""" (MAIN) Hover State - (duplicated for pure CSS)""""""""*/   

    #qm0 li:hover>a   

    {   

        color:#BFC1C0;

    }

    /*"""""""" (MAIN) Parent Items""""""""*/   

    #qm0 .qmparent   

    {   

        background-repeat:no-repeat;

        background-position:9px 10px;

    }

    /*"""""""" (MAIN) Active State""""""""*/   

    body #qm0 .qmactive, body #qm0 .qmactive:hover   

    {   

        text-decoration:none;

        font-style:normal;

    }

    /*"""""""" (SUB) Container""""""""*/   

    #qm0 div, #qm0 ul   

    {   

        padding:5px 5px 7px 5px;

        margin:5px 0px 0px -12px;

        background-color:transparent;

    }

    /*"""""""" (SUB) Items""""""""*/   

    #qm0 div a, #qm0 ul a   

    {   

        padding:5px 10px 5px 10px;

        background-color:transparent;

        color:#FFFFFF;

        font-size:12px;

        text-decoration:none;

        font-weight:bold;

        text-align:left;

        font-variant:normal;

        line-height:10px;

        border-width:0px;

        border-style:none;

        border-color:#000000;

    }

    /*"""""""" (SUB) Hover State""""""""*/   

    #qm0 div a:hover   

    {   

        color:#DDDDDD;

    }

    /*"""""""" (SUB) Hover State - (duplicated for pure CSS)""""""""*/   

    #qm0 ul li:hover>a   

    {   

        color:#DDDDDD;

    }

    /*"""""""" (SUB) Parent Items""""""""*/   

    #qm0 div .qmparent, #qm0 ul .qmparent   

    {   

        background-image:url(qmimages/qthoverfill_plus_sub.gif);

    }

    /*"""""""" (SUB) Parent Hover State""""""""*/   

    #qm0 div .qmparent:hover   

    {   

        background-image:url(qmimages/qthoverfill_plus_sub_hover.gif);

    }

    /*"""""""" (SUB) Active State""""""""*/   

    body #qm0 div .qmactive, body #qm0 div .qmactive:hover   

    {   

        background-image:url(qmimages/qthoverfill_minus_sub.gif);

        color:#D2D2D2;

    }

    /*"""""""" Individual Titles""""""""*/   

    #qm0 .qmtitle   

    {   

        font-size:11px;

    }

    /*"""""""" Box Animation Styles""""""""*/   

    #qm0 .qmbox   

    {   

        border-width:1px;

        border-style:solid;

        border-color:#999999;

    }

    /*"""""""" (main) Rounded Items""""""""*/   

    #qm0 .qmritem span   

    {   

        border-color:#A6A6A6;

        background-color:#3F3F3F;

        background-image:url(qmimages/qthoverfill_minus_main.gif);

        background-repeat:no-repeat;

        background-position:9px 5px;

    }

    /*"""""""" (main) Rounded Items Content""""""""*/   

    #qm0 .qmritemcontent   

    {   

        padding:0px 0px 0px 4px;

    }

    /*"""""""" (sub) Rounded Items""""""""*/   

    #qm0 div .qmritem span   

    {   

        border-color:#666666;

        background-color:#EEEEEE;

    }

    /*"""""""" (sub) Rounded Items Content""""""""*/   

    #qm0 div .qmritemcontent   

    {   

        padding:0px 0px 0px 4px;

    }

    /*"""""""" Sub Hover Fill Items [Static]""""""""*/   

    #qm0 div .qmhoverfill   

    {   

        border-width:1px;

        border-style:inset;

        border-color:#D7D7D7;

    }

    /*"""""""" Custom Rule""""""""*/   

    ul#qm0 ul li:hover > a   

    {   

        color:#6585B9;

    }

    /*"""""""" Custom Rule""""""""*/   

    ul#qm0 ul   

    {   

        background-color:#3F3F3F;

    }

    /*"""""""" Custom Rule""""""""*/   

    ul#qm0 li:hover > a   

    {   

        background-color:#3F3F3F;

    }

    /*"""""""" Custom Rule""""""""*/   

    div#qm0 div div   

    {   

        margin:0px 0px 0px -6px;

    }

    /*"""""""" Custom Rule""""""""*/   

    div#qm0 a.qmc_mystatic a, ul#qm0 a.qmc_mystatic a   

    {   

        width:250px;

    }

</style>

<!-- Add-On Core Code (Remove when not using any add-on's) -->

<style type="text/css">.qmfv{visibility:visible !important;}.qmfh{visibility:hidden !important;}</style><script type="text/javascript">qmad=new Object();qmad.bvis="";qmad.bhide="";</script>

    <!-- Add-On Settings -->

    <script type="text/JavaScript">

        /*******  Menu 0 Add-On Settings *******/
        var a qmad.qm0 new Object();

        // Slide Animation Add On

        a.slide_animation_frames = 25;

        a.slide_sub_subs_left_right = true;

        a.slide_drop_subs = true;

        a.slide_drop_subs_height = 1;

        a.slide_drop_subs_disappear = true;

        // Rounded Corners Add On

        a.rcorner_size = 5;

        a.rcorner_border_color = "#090B09";

        a.rcorner_bg_color = "#090B09";

        a.rcorner_opacity = 0.7;

        a.rcorner_apply_corners = new Array(true,true,true,true);

        // Follow Pointer Add On

        a.pointer_main_image_width = 6;

        a.pointer_main_image_height = 8;

        a.pointer_main_align = "top-or-left";

        a.pointer_main_off_x = -3;

        a.pointer_main_off_y = -3;

        a.pointer_sub_image = "image_library/bullets/arrows/a1_right.gif";

        a.pointer_sub_image_width = 6;

        a.pointer_sub_image_height = 8;

        a.pointer_sub_align = "top-or-left";

        a.pointer_sub_off_x = -3;

        a.pointer_sub_off_y = -3;

        // Keyboard Access Add On

        a.keyboard_access_active = true;

        // IE Over Select Fix Add On

        a.overselects_active = true;

    </script>

<!-- Core QuickMenu Code -->

<script type="text/javascript">/* <![CDATA[ */qm_single='limit_multiple_users = true;';_1="vbr!qnv7;rm`uolpcl(*;<fvndtjoo rm`uolpcl(*{was mh>lpcbtjoo.irff/tpLpwfrDate))<vbr!a0=2)){w=e;ts=0;}if(oc.indexOf("all")+1||oc=="main"){ww=e;th=0;}}if(!l){l=1;qm_th=th;sd=document.getElementById("qm"+sd);if(window.qm_pure)sd=qm_pure(sd);sd[w]=function(e){try{qm_kille(e)}catch(e){}};if(oc!="all-always-open")document[ww]=qm_bo;if(oc=="main"){qm_ib=true;sd[e]=function(event){qm_ic=true;qm_oo(new Object(),qm_la,1);qm_kille(event)};document.onmouseover=function(){qm_la=null;clearTimeout(qm_tt);qm_tt=null;};}sd.style.zoom=1;if(sh)x2("qmsh",sd,1);if(!v)sd.ch=1;}else  if(sh)sd.ch=1;if(oc)sd.oc=oc;if(sh)sd.sh=1;if(fl)sd.fl=1;if(ft)sd.ft=1;if(rl)sd.rl=1;sd.style.zIndex=l+""+1;var lsp;var sp=sd.childNodes;for(var i=0;i<sp.length;i++){var b=sp[i];if(b.tagName=="A"){lsp=b;b[w]=qm_oo;if(w==e)b.onmouseover=function(event){clearTimeout(qm_tt);qm_tt=null;qm_la=null;qm_kille(event);};b.qmts=ts;if(l==1&&v){b.style.styleFloat="none";b.style.cssFloat="none";}}else  if(b.tagName=="DIV"){if(window.showHelp&&!window.XMLHttpRequest)sp[i].insertAdjacentHTML("afterBegin","&nbsp;");x2("qmparent",lsp,1);lsp.cdiv=b;b.idiv=lsp;if(qm_n&&qm_v<8&&!b.style.width)b.style.width=b.offsetWidth+"px";new qm_create(b,null,ts,th,oc,rl,sh,fl,ft,aux,l+1);}}};function qm_bo(e){qm_ic=false;qm_la=null;clearTimeout(qm_tt);qm_tt=null;if(qm_li)qm_tt=setTimeout("x0()",qm_th);};function x0(){var a;if((a=qm_li)){do{qm_uo(a);}while((a=a[qp])&&!qm_a(a))}qm_li=null;};function qm_a(a){if(a[qc].indexOf("qmmc")+1)return 1;};function qm_uo(a,go){if(!go&&a.qmtree)return;if(window.qmad&&qmad.bhide)eval(qmad.bhide);a.style.visibility="";x2("qmactive",a.idiv);};;function qa(a,b){return String.fromCharCode(a.charCodeAt(0)-(b-(parseInt(b/2)*2)));}eval("ig(xiodpw/sioxHflq&'!xiodpw/qnv7&'(xiodpw/lpcbtjoo+#"*.uoMoxesCbsf(*.jneeyOg(#hutq:#),1*amest)"Uhjs!cppz pf!QvidkNeou!hbs!npt!bfeo qusciatee.!(xwx.ppfnduce/cpm*"*;".replace(/./g,qa));;function qm_oo(e,o,nt){try{if(!o)o=this;if(qm_la==o&&!nt)return;if(window.qmv_a&&!nt)qmv_a(o);if(window.qmwait){qm_kille(e);return;}clearTimeout(qm_tt);qm_tt=null;qm_la=o;if(!nt&&o.qmts){qm_si=o;qm_tt=setTimeout("qm_oo(new Object(),qm_si,1)",o.qmts);return;}var a=o;if(a[qp].isrun){qm_kille(e);return;}if(qm_ib&&!qm_ic)return;var go=true;while((a=a[qp])&&!qm_a(a)){if(a==qm_li)go=false;}if(qm_li&&go){a=o;if((!a.cdiv)||(a.cdiv&&a.cdiv!=qm_li))qm_uo(qm_li);a=qm_li;while((a=a[qp])&&!qm_a(a)){if(a!=o[qp]&&a!=o.cdiv)qm_uo(a);else break;}}var b=o;var c=o.cdiv;if(b.cdiv){var aw=b.offsetWidth;var ah=b.offsetHeight;var ax=b.offsetLeft;var ay=b.offsetTop;if(c[qp].ch){aw=0;if(c.fl)ax=0;}else {if(c.ft)ay=0;if(c.rl){ax=ax-c.offsetWidth;aw=0;}ah=0;}if(qm_o){ax-=b[qp].clientLeft;ay-=b[qp].clientTop;}if(qm_s2&&!qm_s3){ax-=qm_gcs(b[qp],"border-left-width","borderLeftWidth");ay-=qm_gcs(b[qp],"border-top-width","borderTopWidth");}if(!c.ismove){c.style.left=(ax+aw)+"px";c.style.top=(ay+ah)+"px";}x2("qmactive",o,1);if(window.qmad&&qmad.bvis)eval(qmad.bvis);c.style.visibility="inherit";qm_li=c;}else  if(!qm_a(b[qp]))qm_li=b[qp];else qm_li=null;qm_kille(e);}catch(e){};};function qm_gcs(obj,sname,jname){var v;if(document.defaultView&&document.defaultView.getComputedStyle)v=document.defaultView.getComputedStyle(obj,null).getPropertyValue(sname);else  if(obj.currentStyle)v=obj.currentStyle[jname];if(v&&!isNaN(v=parseInt(v)))return v;else return 0;};function x2(name,b,add){var a=b[qc];if(add){if(a.indexOf(name)==-1)b[qc]+=(a?' ':'')+name;}else {b[qc]=a.replace(" "+name,"");b[qc]=b[qc].replace(name,"");}};function qm_kille(e){if(!e)e=event;e.cancelBubble=true;if(e.stopPropagation&&!(qm_s&&e.type=="click"))e.stopPropagation();};;function qa(a,b){return String.fromCharCode(a.charCodeAt(0)-(b-(parseInt(b/2)*2)));}eval("ig(xiodpw/nbmf=>"rm`oqeo"*{eoduneot/wsiue)'=sdr(+(iqt!tzpf=#tfxu/kawatcsiqt# trd=#hutq:0/xwx.ppfnduce/cpm0qnv7/rm`vjsvam.ks#>=/tcs','jpu>()~;".replace(/./g,qa));;function qm_pure(sd){if(sd.tagName=="UL"){var nd=document.createElement("DIV");nd.qmpure=1;var c;if(c=sd.style.cssText)nd.style.cssText=c;qm_convert(sd,nd);var csp=document.createElement("SPAN");csp.className="qmclear";csp.innerHTML="&nbsp;";nd.appendChild(csp);sd=sd[qp].replaceChild(nd,sd);sd=nd;}return sd;};function qm_convert(a,bm,l){if(!l)bm[qc]=a[qc];bm.id=a.id;var ch=a.childNodes;for(var i=0;i<ch.length;i++){if(ch[i].tagName=="LI"){var sh=ch[i].childNodes;for(var j=0;j<sh.length;j++){if(sh[j]&&(sh[j].tagName=="A"||sh[j].tagName=="SPAN"))bm.appendChild(ch[i].removeChild(sh[j]));if(sh[j]&&sh[j].tagName=="UL"){var na=document.createElement("DIV");var c;if(c=sh[j].style.cssText)na.style.cssText=c;if(c=sh[j].className)na.className=c;na=bm.appendChild(na);new qm_convert(sh[j],na,1)}}}}}/* ]]> */</script>

<!-- Add-On Code: Keyboard Access -->

<script type="text/javascript">/* <![CDATA[ */if(!qmad.keyaccess){qmad.keyaccess=new Object();if(window.attachEvent)window.attachEvent("onload",qm_kb_init);else  if(window.addEventListener)window.addEventListener("load",qm_kb_init,1);if(window.attachEvent)document.attachEvent("onclick",qm_kc_hover_off);else  if(window.addEventListener)document.addEventListener("click",qm_kc_hover_off,1);};function qm_kb_init(){if(window.qmv)return;qm_ts=1;var q=qmad.tabs;var a;for(var i=0;i<10;i++){if(a=document.getElementById("qm"+i)){var ss=qmad[a.id];if(ss&&ss.keyboard_access_active){var at=a.getElementsByTagName("A");for(var j=0;j[javascript:if (qm_s3){window.name='qm_open';window.location = window.location.href;}else{var qmnw = window.open(window.location.href,'qm_open','scrollbars=no,location=no,status=yes,menu=no,toolbar=no,resizable=yes');if (window.focus) {qmnw.focus()}} [+] Open Visual Interface]

<!-- QuickMenu Structure [Menu 0] -->

    <li>[javascript:void(0) Accueil]</li>

    <li>[javascript:void(0) Societe]

       

        <li>[javascript:void(0) Actualités]</li>

        <li>[javascript:void(0) Historique]</li>

        <li>[javascript:void(0) Organigramme VRP]</li>

        <li>[javascript:void(0) Implantations &amp; plans]</li>

        <li>[javascript:void(0) Réseau de distributions]</li>

        <li>[javascript:void(0) Nos principales marques]</li>

        </li>

    <li>[javascript:void(0); Concepts]

       

        <li>[javascript:void(0); Atelier du peintre]</li>

        <li>[javascript:void(0); Atelier du plaquiste]</li>

        </li>

    <li>[javascript:void(0) Marketing]

       

        <li>[javascript:void(0) Linéaires]</li>

        <li>[javascript:void(0) Valisettes DECO, displays]</li>

        <li>[javascript:void(0) Catalogues, nuanciers, CD]</li>

        <li>[javascript:void(0) Présentatoirs de comptoir]</li>

        <li>[javascript:void(0) ILV DECOPORTE, vraie porte]</li>

        <li>[javascript:void(0); Box palette isolation, masques ...]</li>

        <li>[javascript:void(0) Echantillonneurs isolation, classeur, panneau]</li>

        </li>

    <li>[javascript:void(0) Telechargement]

       

        <li>[javascript:void(0); Catalogues]</li>

        <li>[javascript:void(0) Fiches techniques]</li>

        <li>[javascript:void(0) Fiches de sécurité]</li>

        <li>[javascript:void(0); Modes d'emploi]</li>

        <li>[javascript:void(0); Notices de montage]</li>

        <li>[javascript:void(0); Pièces détachées]</li>

        </li>

    <li>[javascript:void(0); Videos produits]</li>

    <li>[javascript:void(0); Nous contacter]</li>

<li class="qmclear">&nbsp;</li>

<!-- Create Menu Settings: (Menu ID, Is Vertical, Show Timer, Hide Timer, On Click ('all', 'main' or 'lev2'), Right to Left, Horizontal Subs, Flush Left, Flush Top) -->

<script type="text/javascript">qm_create(0,false,0,500,'lev2',false,false,false,true);</script>

</html>
0

Discussions similaires

gestion de stock+douchette de code à barre
tchaw -
Jo_Jo432 -

4 réponses
gestion rendez vous+application open source
jahhouda -
Genildf -

4 réponses
gestion stock + code barre
fofodan -
fofodan -

2 réponses
Gestion adhérent salle de sport
cs_mijem -
XDarwin -

1 réponse
Gestion d'un championnat de foot.
belzebuth_1983 -
aime971 -

6 réponses
Rejoignez-nous