IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

menu retractable sos


Sujet :

JavaScript

  1. #1
    Débutant(e)
    Inscrit en
    Mars 2006
    Messages
    109
    Détails du profil
    Informations forums :
    Inscription : Mars 2006
    Messages : 109
    Points : 64
    Points
    64
    Par défaut menu retractable sos
    voilà, j'aimerais savoir comment faire pour que mon menu rectractable soit fermé au moment du chargement de la page , j'aimerais aussi savoir comment faire pour que mon menu bouge lorsque je me déplace tt au long de la page. mon menu est sur le coté gauche tt a fait en haut et j'aimerais qu'il se déplace lorsque je parcours ma page vers le bas.

    je débute ds le javascript et votre aide m'est trés précieuse

    voici le code .js

    //Static Slide Menu 6.5 © MaXimuS 2000-2001, All Rights Reserved.
    //Site: http://www.absolutegb.com/maximus
    //E-mail: maximus@nsimail.com
    //Script featured on Dynamic Drive (http://www.dynamicdrive.com)

    NS6 = (document.getElementById&&!document.all)
    IE = (document.all)
    NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")

    tempBar='';barBuilt=0;ssmItems=new Array();


    moving=setTimeout('null',1)
    function moveOut() {
    if ((NS6||NS)&&parseInt(ssm.left)<0 || IE && ssm.pixelLeft<0) {
    clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)}
    else {clearTimeout(moving);moving=setTimeout('null',1)}};
    function moveBack() {clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
    function moveBack1() {
    if ((NS6||NS) && parseInt(ssm.left)>(-menuWidth) || IE && ssm.pixelLeft>(-menuWidth)) {
    clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);slideMenu(-10)}
    else {clearTimeout(moving);moving=setTimeout('null',1)}}
    function slideMenu(num){
    if (IE) {ssm.pixelLeft += num;}
    if (NS||NS6) {ssm.left = parseInt(ssm.left)+num +"px"; }
    if (NS) {bssm.clip.right+=num;bssm2.clip.right+=num;}}

    function makeStatic() {
    if (NS||NS6) {winY = window.pageYOffset;}
    if (IE) {winY = document.body.scrollTop;}
    if (NS6||IE||NS) {
    if (winY!=lastY&&winY>YOffset-staticYOffset) {
    smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
    else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
    smooth = .2 * (winY - lastY - (YOffset-(YOffset-winY)));}
    else {smooth=0}
    if(smooth > 0) smooth = Math.ceil(smooth);
    else smooth = Math.floor(smooth);
    if (IE) bssm.pixelTop+=smooth;
    if (NS6||NS) bssm.top=parseInt(bssm.top)+smooth
    lastY = lastY+smooth;
    setTimeout('makeStatic()', 1)}}

    function buildBar() {
    if(barText.indexOf('<IMG')>-1) {tempBar=barText}
    else{for (b=0;b<barText.length;b++) {tempBar+=barText.charAt(b)+"<BR>"}}
    document.write('<td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD>')}

    function initSlide() {
    if (NS6){
    ssm=document.getElementById("thessm").style;
    bssm=document.getElementById("basessm").style;
    bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";
    }else if (IE) {
    ssm=document.all("thessm").style;
    bssm=document.all("basessm").style;
    bssm.clip="rect(0 "+thessm.offsetWidth+" "+thessm.offsetHeight+" 0)";bssm.visibility = "visible";
    }else if (NS) {
    bssm=document.layers["basessm1"];
    bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
    bssm2.clip.left=0;ssm.visibility = "show";
    }
    if (menuIsStatic=="yes")
    makeStatic();
    }

    function buildMenu() {
    if (IE||NS6) {
    document.write('<DIV ID="basessm" style="visibility:hidden;Position : Absolute ;Left : '+XOffset+' ;Top : '+YOffset+' ;Z-Index : 20;width:'+(menuWidth+barWidth+10)+'"><DIV ID="thessm" style="Position : Absolute ;Left : '+(-menuWidth)+' ;Top : 0 ;Z-Index : 20;" onmouseover="moveOut()" onmouseout="moveBack()">');
    }
    if (NS) {
    document.write('<LAYER name="basessm1" top="'+YOffset+'" LEFT='+XOffset+' visibility="show"><ILAYER name="basessm2"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'" onmouseover="moveOut()" onmouseout="moveBack()">');
    }
    if (NS6){
    document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'"><TR><TD>');
    }
    document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'" bgcolor="'+menuBGColor+'">');
    for(i=0;i<ssmItems.length;i++) {
    if(!ssmItems[i][3]){
    ssmItems[i][3]=menuCols;
    ssmItems[i][5]=menuWidth-1;
    }else if(ssmItems[i][3]!=menuCols)
    ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
    if ( ssmItems[i-1] && ssmItems[i-1][4] != "no" ) {

    document.write('<TR>');
    }
    if(!ssmItems[i][1]){
    document.write('<td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'"><font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"> <b>'+ssmItems[i][0]+'</b></font></td>');
    }else {
    if(!ssmItems[i][2])
    ssmItems[i][2]=linkTarget;
    document.write('<TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+ssmItems[i][5]+'" COLSPAN="'+ssmItems[i][3]+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+ssmItems[i][1]+'" target="'+ssmItems[i][2]+'" CLASS="ssmItems">'+ssmItems[i][0]+'</DIV></LAYER></ILAYER></TD>');
    }
    if(ssmItems[i][4]!="no"&&barBuilt==0){
    buildBar();
    barBuilt=1;
    }
    if(ssmItems[i][4]!="no"){
    document.write('</TR>');
    }
    }
    document.write('</table>');
    if (NS6){
    document.write('</TD></TR></TABLE>');
    }
    if (IE||NS6) {
    document.write('</DIV></DIV>');
    }
    if (NS) {
    document.write('</LAYER></ILAYER></LAYER>');
    }
    theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1);
    }


    <!--



    /*

    Configure menu styles below

    NOTE: To edit the link colors, go to the STYLE tags and edit the ssm2Items colors

    */



    b=(screen.width==800&&screen.height==600);


    if(b) YOffset=0;
    else YOffset=10; // no quotes!!
    XOffset=0;
    staticYOffset=6; // no quotes!!
    slideSpeed=20 // no quotes!!
    waitTime=100; // no quotes!! this sets the time the menu stays out for after the mouse goes off it.
    menuBGColor="RoyalBlue";
    menuIsStatic="yes"; //this sets whether menu should stay static on the screen
    if(b) menuWidth=160;
    else menuWidth=180; // Must be a multiple of 10! no quotes!!
    menuCols=2;
    hdrFontFamily="verdana";
    if(b) hdrFontSize="1";
    else hdrFontSize="2";
    hdrFontColor="Navy";
    hdrBGColor="Sandybrown";
    hdrAlign="center";
    hdrVAlign="center";
    hdrHeight="15";
    linkFontFamily="Verdana";
    if(b) linkFontSize="1";
    else linkFontSize="2";
    linkBGColor="white";
    linkOverBGColor="PaleGoldenrod";
    linkTarget="_top";
    linkAlign="Left";
    barBGColor="Sandybrown";
    barFontFamily="Verdana";
    if(b) barFontSize="1";
    else barFontSize="2";
    barFontColor="Navy";
    barVAlign="center";
    barWidth=20; // no quotes!!
    barText="Voir le MENU"; // <IMG> tag supported. Put exact html for an image to show.



    ///////////////////////////
    // ssmItems[...]=[name, link, target, colspan, endrow?] - leave 'link' and 'target' blank to make a header

    ssmItems[0]=["Présentation"] //create header
    ssmItems[1]=["Qui Sommes nous?", "url1.1",""] //create header
    ssmItems[2]=["La RO en bref", "url1.2",""]
    ssmItems[3]=["Nous Contacter", "url1.3",""]
    ssmItems[4]=["Le Projet", "", ""] //create header
    ssmItems[5]=["Introduction Générale", "url2.1",""]
    ssmItems[6]=["La Division Forage", "url2.2",""]
    ssmItems[7]=["L'activité de Forage", "url2.3", ""]
    ssmItems[8]=["Problématique", "url2.4", ""]
    ssmItems[9]=["3"] //create header
    ssmItems[10]=["3.1", "url3.1",""]
    ssmItems[11]=["3.2", "url3.2",""]
    ssmItems[12]=["3.3", "url3.3",""]



    buildMenu();



    //-->


  2. #2
    Membre expérimenté Avatar de willoi
    Profil pro
    Développeur informatique
    Inscrit en
    Décembre 2006
    Messages
    1 355
    Détails du profil
    Informations personnelles :
    Âge : 51
    Localisation : France, Haute Garonne (Midi Pyrénées)

    Informations professionnelles :
    Activité : Développeur informatique

    Informations forums :
    Inscription : Décembre 2006
    Messages : 1 355
    Points : 1 639
    Points
    1 639
    Par défaut
    Utilise la balise code , c est plus lisible!


    Et quel est l erreur au juste?

  3. #3
    Débutant(e)
    Inscrit en
    Mars 2006
    Messages
    109
    Détails du profil
    Informations forums :
    Inscription : Mars 2006
    Messages : 109
    Points : 64
    Points
    64
    Par défaut
    ok d'accord :-)

    ben au fait comme je l'ai mentionné, le menu reste en haut collé, or j'aurais aimer qu'il se dépalce tt a ulong de la page, lorsque je me déplace vers le bas.

    et puis le menu est ouvert au chargement de la page, or j'aurais aimer qu'il soit fermé..... merci bcp

  4. #4
    Débutant(e)
    Inscrit en
    Mars 2006
    Messages
    109
    Détails du profil
    Informations forums :
    Inscription : Mars 2006
    Messages : 109
    Points : 64
    Points
    64
    Par défaut
    j'ai pensé a rajouter "xp" a left, top....mais j'ai eu carrément un autre résulat, parfois le menu même disparaissait

  5. #5
    Expert éminent sénior

    Homme Profil pro
    Inscrit en
    Janvier 2007
    Messages
    13 474
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations professionnelles :
    Secteur : Finance

    Informations forums :
    Inscription : Janvier 2007
    Messages : 13 474
    Points : 36 571
    Points
    36 571
    Par défaut
    Citation Envoyé par faten7
    j'ai pensé a rajouter "xp" a left, top....mais j'ai eu carrément un autre résulat, parfois le menu même disparaissait
    Quand on ajoute XP, y a souvent des pb

    Essaye avec "px" ...

    A+

  6. #6
    Débutant(e)
    Inscrit en
    Mars 2006
    Messages
    109
    Détails du profil
    Informations forums :
    Inscription : Mars 2006
    Messages : 109
    Points : 64
    Points
    64
    Par défaut
    voici le code que j'ai mis en mettant les "xp" mais ça n'a pas changé puisque mon menu disparait de nouveau

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    100
    101
    102
    103
    104
    105
    106
    107
    108
    109
    110
    111
    112
    113
    114
     
     
    NS6 = (document.getElementById&&!document.all)
    IE = (document.all)
    NS = (navigator.appName=="Netscape" && navigator.appVersion.charAt(0)=="4")
     
    tempBar='';barBuilt=0;ssmItems=new Array();
     
     
    moving=setTimeout('null',1)
    function moveOut() {
    if ((NS6||NS)&&parseInt(ssm.left)<0 || IE && ssm.pixelLeft<0) {
    clearTimeout(moving);moving = setTimeout('moveOut()', slideSpeed);slideMenu(10)}
    else {clearTimeout(moving);moving=setTimeout('null',1)}};
    function moveBack() {clearTimeout(moving);moving = setTimeout('moveBack1()', waitTime)}
    function moveBack1() {
    if ((NS6||NS) && parseInt(ssm.left)>(-menuWidth) || IE && ssm.pixelLeft>(-menuWidth)) {
    clearTimeout(moving);moving = setTimeout('moveBack1()', slideSpeed);slideMenu(-10)}
    else {clearTimeout(moving);moving=setTimeout('null',1)}}
    function slideMenu(num){
    if (IE) {ssm.pixelLeft += num;}
    if (NS||NS6) {ssm.left = parseInt(ssm.left)+num +"px"; }
    if (NS) {bssm.clip.right+=num;bssm2.clip.right+=num;}}
     
    function makeStatic() {
    if (NS||NS6) {winY = window.pageYOffset;}
    if (IE) {winY = document.body.scrollTop;}
    if (NS6||IE||NS) {
    if (winY!=lastY&&winY>YOffset-staticYOffset) {
    smooth = .2 * (winY - lastY - YOffset + staticYOffset);}
    else if (YOffset-staticYOffset+lastY>YOffset-staticYOffset) {
    smooth = .2 * (winY - lastY - (YOffset-(YOffset-winY)));}
    else {smooth=0}
    if(smooth > 0) smooth = Math.ceil(smooth);
    else smooth = Math.floor(smooth);
    if (IE) bssm.pixelTop+=smooth;
    if (NS6||NS) bssm.top=parseInt(bssm.top)+smooth
    lastY = lastY+smooth;
    setTimeout('makeStatic()', 1)}}
     
    function buildBar() {
    if(barText.indexOf('<IMG')>-1) {tempBar=barText}
    else{for (b=0;b<barText.length;b++) {tempBar+=barText.charAt(b)+"<BR>"}}
    document.write('<td align="center" rowspan="100" width="'+barWidth+'" bgcolor="'+barBGColor+'" valign="'+barVAlign+'"><p align="center"><font face="'+barFontFamily+'" Size="'+barFontSize+'" COLOR="'+barFontColor+'"><B>'+tempBar+'</B></font></p></TD>')}
     
    function initSlide() {
    if (NS6){
    ssm=document.getElementById("thessm").style;
    bssm=document.getElementById("basessm").style;
    bssm.clip="rect(0 "+document.getElementById("thessm").offsetWidth+" "+document.getElementById("thessm").offsetHeight+" 0)";ssm.visibility="visible";
    }else if (IE) {
    ssm=document.all("thessm").style;
    bssm=document.all("basessm").style;
    bssm.clip="rect(0 "+thessm.offsetWidth+" "+thessm.offsetHeight+" 0)";bssm.visibility = "visible";
    }else if (NS) {
    bssm=document.layers["basessm1"];
    bssm2=bssm.document.layers["basessm2"];ssm=bssm2.document.layers["thessm"];
    bssm2.clip.left=0;ssm.visibility = "show";
    }
    if (menuIsStatic=="yes")
    makeStatic();
    }
     
    function buildMenu() {
    if (IE||NS6) {
    document.write('<DIV ID="basessm" style="visibility:hidden;Position : Absolute ;Left : '+XOffset+'px ;Top : '+YOffset+' ;Z-Index : 20;width:'+(menuWidth+barWidth+10)+'px"><DIV ID="thessm" style="Position : Absolute ;Left : '+(-menuWidth)+'px ;Top : 0+px ;Z-Index : 20;" onmouseover="moveOut()" onmouseout="moveBack()">');
    }
    if (NS) {
    document.write('<LAYER name="basessm1" top="'+YOffset+'px" LEFT='+XOffset+'px visibility="hidden"><ILAYER name="basessm2"><LAYER visibility="hide" name="thessm" bgcolor="'+menuBGColor+'" left="'+(-menuWidth)+'px" onmouseover="moveOut()" onmouseout="moveBack()">');
    }
    if (NS6){
    document.write('<table border="0" cellpadding="0" cellspacing="0" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'"><TR><TD>');
    }
    document.write('<table border="0" cellpadding="0" cellspacing="1" width="'+(menuWidth+barWidth+2)+'px" bgcolor="'+menuBGColor+'">');
    for(i=0;i<ssmItems.length;i++) {
    if(!ssmItems[i][3]){
    ssmItems[i][3]=menuCols;
    ssmItems[i][5]=menuWidth-1;
    }else if(ssmItems[i][3]!=menuCols)
    ssmItems[i][5]=Math.round(menuWidth*(ssmItems[i][3]/menuCols)-1);
    if ( ssmItems[i-1] && ssmItems[i-1][4] != "no" ) {
     
    document.write('<TR>');
    }
    if(!ssmItems[i][1]){
    document.write('<td bgcolor="'+hdrBGColor+'" HEIGHT="'+hdrHeight+'px" ALIGN="'+hdrAlign+'" VALIGN="'+hdrVAlign+'" WIDTH="'+ssmItems[i][5]+px" COLSPAN="'+ssmItems[i][3]+'"><font face="'+hdrFontFamily+'" Size="'+hdrFontSize+'" COLOR="'+hdrFontColor+'"> <b>'+ssmItems[i][0]+'</b></font></td>');
    }else {
    if(!ssmItems[i][2])
    ssmItems[i][2]=linkTarget;
    document.write('<TD BGCOLOR="'+linkBGColor+'" onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="'+ssmItems[i][5]+'px" COLSPAN="'+ssmItems[i][3]+'"><ILAYER><LAYER onmouseover="bgColor=\''+linkOverBGColor+'\'" onmouseout="bgColor=\''+linkBGColor+'\'" WIDTH="100%" ALIGN="'+linkAlign+'"><DIV ALIGN="'+linkAlign+'"><FONT face="'+linkFontFamily+'" Size="'+linkFontSize+'"> <A HREF="'+ssmItems[i][1]+'" target="'+ssmItems[i][2]+'" CLASS="ssmItems">'+ssmItems[i][0]+'</DIV></LAYER></ILAYER></TD>');
    }
    if(ssmItems[i][4]!="no"&&barBuilt==0){
    buildBar();
    barBuilt=1;
    }
    if(ssmItems[i][4]!="no"){
    document.write('</TR>');
    }
    }
    document.write('</table>');
    if (NS6){
    document.write('</TD></TR></TABLE>');
    }
    if (IE||NS6) {
    document.write('</DIV></DIV>');
    }
    if (NS) {
    document.write('</LAYER></ILAYER></LAYER>');
    }
    theleft=-menuWidth;lastY=0;setTimeout('initSlide();', 1);
    }
     
     
    <!--



    merci pour votre aide :-)

  7. #7
    Débutant(e)
    Inscrit en
    Mars 2006
    Messages
    109
    Détails du profil
    Informations forums :
    Inscription : Mars 2006
    Messages : 109
    Points : 64
    Points
    64
    Par défaut
    personne ne pourra m'aider sur ce pot :-(

    j'ai tjr encore rien trouver

  8. #8
    Expert éminent sénior
    Avatar de Auteur
    Profil pro
    Inscrit en
    Avril 2004
    Messages
    7 651
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2004
    Messages : 7 651
    Points : 11 145
    Points
    11 145
    Par défaut
    bonjour,

    je dois avouer que ton code est peu lisible donc pour le débugger

    Quel genre de menu est-ce ?
    As-tu un lien pour que l'on puisse voir le résultat ?

Discussions similaires

  1. TreeView et menu contextuel...
    Par agh dans le forum Composants VCL
    Réponses: 6
    Dernier message: 06/04/2009, 12h23
  2. [système] Comment ajouter un item dans le context menu de Windows ?
    Par ddmicrolog dans le forum API, COM et SDKs
    Réponses: 8
    Dernier message: 29/06/2005, 17h03
  3. Menu d'installation
    Par Le Yannos dans le forum Langage
    Réponses: 3
    Dernier message: 27/08/2002, 22h15
  4. Inserer Un Menu dans un autre en execution
    Par apt dans le forum Composants VCL
    Réponses: 2
    Dernier message: 12/08/2002, 11h22
  5. Menu en GL
    Par Kaïn dans le forum OpenGL
    Réponses: 2
    Dernier message: 06/05/2002, 11h58

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo