Frage zu onMouseOut

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • Frage zu onMouseOut

    Hi, ich hab eine Frage zu onMouseout. Und zwar bei folgender kleinen Seite zum testen:

    <html>
    <head>
    <title> Menu</title>
    <script type="text/javascript">
    <!--

    function show(divid) {
    document.getElementById("cat1").style.display="none";
    document.getElementById("cat2").style.display="none";

    document.getElementById(divid).style.display="inline";

    }

    function close(divid) {
    document.getElementById(divid).style.display="none";

    }
    //-->
    </script>
    <script language="JavaScript" type="text/JavaScript">
    <!--
    function MM_reloadPage(init) { //reloads the window if Nav4 resized
    if (init==true) with (navigator) {if
    ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight;
    onresize=MM_reloadPage; }}
    else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH)
    location.reload();
    }
    MM_reloadPage(true);

    function MM_preloadImages() { //v3.0
    var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length;
    i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} }

    function MM_swapImgRestore() { //v3.0
    var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++)
    x.src=x.oSrc;
    }

    function MM_findObj(n, d) { //v4.01
    var p,i,x; if(!d) d=document;
    if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
    if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++)
    x=d.forms[i][n];
    for(i=0;!x&&d.layers&&i<d.layers.length;i++)
    x=MM_findObj(n,d.layers[i].document);
    if(!x && d.getElementById) x=d.getElementById(n); return x;
    }

    function MM_swapImage() { //v3.0
    var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array;
    for(i=0;i<(a.length-2);i+=3)
    if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc)
    x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    </head>
    <body bgcolor="#FFFFFF" onLoad="MM_preloadImages('Button%201%202%20Kopie.gif')">
    <a href="#" onMouseOver="MM_swapImage('Image1','','Button%201%202%20Kopie.gif',1);show('cat1')" >Category 1</a><br>
    <div id="cat1" style="display:none">
    <a href="#" class="sub">Test</a><br>
    <a href="#" class="sub">sjdhajks</a><br>
    <a href="#" class="sub">sjkdsadjk</a><br>
    </div>
    <a href="#" onMouseOver="show('cat2')">Category 2</a><br>
    <div id="cat2" style="display:none">
    <p><a href="#" class="sub"><a href="#" class="sub">Test</a><br>
    <a href="#" class="sub">Test2</a><br>
    <a href="#" class="sub">Test3</a><br>
    </div></a>
    </p>

    <p>&nbsp; </p>
    </div><br>
    </body>
    </head>
    </html>

    Wie mach ich das denn das sich das Menu schließt wenn ich mit der Maus davon weggeh?

    Ich hatte das mal mit der closefunktion versucht die aber nicht funktioniert hat(hab sie trotzdem mal drinstehnlassen).

    Kann mir da wer weiterhelfen??
    Thx schonmal

  • #2
    Code:
    <html>
    <head>
    <title> Menu</title>
    <script type="text/javascript">
    <!--
    function show_div(divid)
    {
        document.getElementById("cat1").style.display="none";
        document.getElementById("cat2").style.display="none";
        document.getElementById(divid).style.display="inline";
    }
    
    function close_all_divs()
    {
        document.getElementById("cat1").style.display="none";
        document.getElementById("cat2").style.display="none";
    }
    //-->
    </script>
    
    </head>
    
    <body bgcolor="#FFFFFF">
    
    <a href="#" onMouseOver="show_div('cat1')" onMouseOut="close_all_divs()">Category 1</a><br>
    
    <div id="cat1" style="display:none">
    <a href="#" class="sub">Test</a><br> 
    <a href="#" class="sub">sjdhajks</a><br> 
    <a href="#" class="sub">sjkdsadjk</a><br> 
    </div>
    
    <a href="#" onMouseOver="show_div('cat2')" onMouseOut="close_all_divs()">Category 2</a><br> 
    
    <div id="cat2" style="display:none">
    <p><a href="#" class="sub"><a href="#" class="sub">Test</a><br> 
    <a href="#" class="sub">Test2</a><br> 
    <a href="#" class="sub">Test3</a><br> 
    </div>
    
    
    </div><br>
    </body>
    </head>
    </html>
    INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


    Kommentar


    • #3
      Perfekt, dankeschön!!

      Kommentar


      • #4
        Aber eine Sache hab ich noch, ist mir vorhin gar nicht aufgefallen vorhin..

        Wenn ich ihm den closebefehl gebe wenn er eine Tabelle mit Unterpunkten verlässt sollte die doch erst zugehn wenn ich von der ganzen Tabelle unten bin? WEil ich kann nur die erste Zeile auswählen, alsbald ich drüber hinaus bin macht er die ganze Category wieder zu...


        PHP-Code:
        <<a href="#" class="sub" onMouseOut="close_all_divs()"> <table width="100" border="0" cellspacing="0" cellpadding="0">
            <
        tr>
              <
        td>Test1</td>
            </
        tr>
            <
        tr>
              <
        td>Test2</td>
            </
        tr>
            <
        tr>
              <
        td>Test3</td>
            </
        tr>
          </
        table></a

        Kommentar


        • #5
          das ist jetzt die herausforderung an dich..

          ich habe dir gezeigt wie es gehen kann und du machst den rest....
          INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


          Kommentar


          • #6
            hmm..naagut aber wenn ichs net hinbekomme muss ich dich nochma fragen...aber ich versuchs ma nochn bisserl

            Kommentar


            • #7
              k.p. fragen kannst du immer stellen, nur immer erst einmal selber versuchen und nicht immer andere machen lassen. aber das willst du ja jetzt eh so machen..
              INFO: Erst suchen, dann posten![color=red] | [/color]MANUAL(s): PHP | MySQL | HTML/JS/CSS[color=red] | [/color]NICE: GNOME Do | TESTS: Gästebuch[color=red] | [/color]IM: Jabber.org |


              Kommentar


              • #8
                Ich hatte mich ja schon ein bisschen versucht Nur hatte es nicht funktioniert. Habs jetzt hinbekommen auch wenn ich nicht ganz verstehe wieso ich das so machen muss Aber egal, Hauptsache es funktioniert

                PHP-Code:
                <a href="#" onMouseOver="show_div('cat1')" >Category 1</a><br>
                <
                div id="cat1" >
                 <
                a href="#" class="sub" onMouseOver="show_div('cat1')" onMouseOut="close_all_divs()"><table width="100" border="0" cellspacing="0" cellpadding="0">
                    <
                tr>
                      <
                td>Test1</td>
                    </
                tr>
                    <
                tr>
                      <
                td>Test2</td>
                    </
                tr>
                    <
                tr>
                      <
                td>Test3</td>
                    </
                tr>
                  </
                table></a>
                </
                div

                Kommentar

                Lädt...
                X