tutorials.de Buch-Aktion 02/2012
ERLEDIGT
JA
ANTWORTEN
2
ZUGRIFFE
808
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
AUF DIESES THEMA
ANTWORTEN
  1. 07.02.07 19:18 #1
    Medienoperator Medienoperator ist offline Mitglied Silber
    Registriert seit
    Jun 2004
    Ort
    Freiburg
    Beiträge
    79
    Hallo,
    bastle gerade an einem Aufklappmenü und habe nun das Problem, dass das Menü zwar aufklappt,, aber sobald die Maus das Menü verlässt, bleibt es offen. Es sollte jedoch wieder zuklappen, nachdem der Mauszeiger außerhalb vom Menü ist. Vielleicht kann mir ja einer von euch schlauen Köpfen weiterhelfen?

    Hier mein Code:

    Code :
    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
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138

    <!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" xml:lang="fr" lang="fr">
<head>
<title>Expanding horizontal menu</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 
<script type="text/javascript">
<!--
function flutsch(id) {
var d = document.getElementById(id);
    for (var i = 1; i<=10; i++) {
        if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
    }
if (d) {d.style.display='block';}
}
//-->
</script>
 
 
<style type="text/css">
<!--
/* CSS from tutorials of www.alsacreations.com/articles */
 
 
 
#menu dl,
#menu dt,
#menu dd,
#menu ul,
#menu li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 0;
left: 0;
z-index:100;
width: 100%; /* precision for Opera */
}
#menu dl {
float: left;
width: 12em;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ccc;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}
#menu li a:hover, #menu dt a:hover {
background: #eee;
}
 
 
 
 
-->
</style>
</head>
 
<body>
 
<div id="menu">
 
    <dl>
        <dt onmouseover="javascript:flutsch('smenu1');">Menu 1</dt>
            <dd id="smenu1">
                <ul>
                    <li><a href="#">Sub Menu 1.1</a></li>
 
                    <li><a href="#">Sub Menu 1.2</a></li>
                    <li><a href="#">Sub Menu 1.3</a></li>
                    <li><a href="#">Sub Menu 1.4</a></li>
                    <li><a href="#">Sub Menu 1.5</a></li>
                    <li><a href="#">Sub Menu 1.6</a></li>
                </ul>
 
            </dd>
    </dl>
 
 
    <dl>
        <dt onmouseover="javascript:flutsch();"><a href="">Menu 2</a></dt>
    </dl>
 
    <dl>
        <dt onmouseover="javascript:flutsch('smenu3');">Menu 3</dt>
            <dd id="smenu3">
                <ul>
 
                    <li><a href="#">Sub Menu 3.1</a></li>
                    <li><a href="#">Sub Menu 3.2</a></li>
                    <li><a href="#">Sub Menu 3.3</a></li>
                    <li><a href="#">Sub Menu 3.4</a></li>
                    <li><a href="#">Sub Menu 3.5</a></li>
                </ul>
 
            </dd>
    </dl>
 
    <dl>
        <dt onmouseover="javascript:flutsch('smenu4');">Menu 4</dt>
            <dd id="smenu4">
                <ul>
                    <li><a href="#">Sub Menu 4.1</a></li>
                    <li><a href="#">Sub Menu 4.2</a></li>
 
                    <li><a href="#">Sub Menu 4.3</a></li>
                </ul>
            </dd>
    </dl>
 
</div>
 
 
 
 
</body>
</html>
     
    Zitieren Zitieren
  2. 07.02.07 20:15 #2
    Avatar von Dac-XP
    Dac-XP Dac-XP ist offline Mitglied Gold
    Registriert seit
    Feb 2004
    Ort
    Mönchengladbach
    Beiträge
    213
    Guck dir mal vielleicht das hier an:
    http://dac-xp.com/main.php?page=show_tutorial&tut_id=11

    Da erkläre ich, wie genau so ein Menü programmiert wird.
     
    MfG Dac! ;)

    Mein Blog
    Zitieren Zitieren
  3. 08.02.07 15:51 #3
    Medienoperator Medienoperator ist offline Mitglied Silber
    Registriert seit
    Jun 2004
    Ort
    Freiburg
    Beiträge
    79
    Super. Genau so etwas habe ich gesucht. Vielen Dank.
     
    Zitieren Zitieren
« mediaplayer mit timestamp-übergabe bei seitenwechsel | Button aktivieren »

Ähnliche Themen

  1. Javascript Menü was den FF liebt aber den IE nicht will
    Von bensky im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 05.11.07, 16:16
  2. Drucklayout und Javascript: IE+Opera klappt-Netscape 7.1+Firefox1.07 klappt nicht
    Von 53783_dagmar im Forum Javascript & Ajax
    Antworten: 0
    Letzter Beitrag: 15.08.07, 13:59
  3. Javascript pulldown Menü funktioniert nicht im IE aber mit Firefox
    Von philipphammer im Forum Javascript & Ajax
    Antworten: 2
    Letzter Beitrag: 17.06.07, 22:58
  4. Javascript mehr infos einblenden klappt nicht
    Von SnakeBite334 im Forum Javascript & Ajax
    Antworten: 5
    Letzter Beitrag: 19.04.05, 17:27
  5. Javascript+PHP == Menü, aber wie?
    Von Muffinmampfer im Forum Javascript & Ajax
    Antworten: 7
    Letzter Beitrag: 06.02.04, 14:39