nicht angemeldet
CSS hover -display Problem mit IE
Bin am verzweifeln, bei mouseover (Kontakt) soll der nächste block angezeigt werden. Alle Browser bis auf IE`s - top.
Die div`s werden mit z-index überlappt.
Hier mein Navigation/css (liegt in einem div "menu") (externe css datei):
/* Navigation mit Listen*/
#menu {
position: absolute;
top: 115px;
left: 100px;
width:90px;
background-color: transparent;
line-height: 125%;
}
#menu ul {
list-style: none;
margin: 0;
padding: 0;
}
#menu a, #menu h2 {
font-family:"Comic Sans MS", Arial, Helvetica, sans-serif;
font-size: 0.9em;
text-decoration:none;
color:#cfd0d1;
display: block;
margin: 0;
padding: 2px 0px;
}
#menu h2 {
color: #cfd0d1;
background: transparent;
text-transform: uppercase;
}
#menu a {
color: #cfd0d1;
background: transparent;
text-decoration: none;
}
#menu a:hover {
color: #f58220;
background: transparent;
}
#menu li {
position: relative;
}
#menu ul ul {
position: absolute;
top: 20px;
left: 10%;
width: 100%;
}
div#menu ul ul, #divmenu ul li:hover ul {
display: none;
}
div#menu ul li:hover ul, div#menu ul ul li:hover ul{
display: block;
}
/* Navigation Listen Ende*/
--------------------------------------------------------------------
und hier html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Navi</title>
<meta name="language" content="de" />
<meta name="robots" content="index, follow" />
<meta name="revisit-after" content="14 days" />
<link rel="stylesheet" href="styles/test.css" type="text/css" media="screen, projection" />
</head>
<body>
<div id="container">
<div id="logo"><!-- logo !--></div>
<div id="hgbild"><!-- hgbild!--></div>
<div id="content"><!-- Hauptinhalt !--></div><!-- Ende content !-->
<!-- Beginn Navigation !-->
<div id="menu">
<ul>
<li><h2>Hauptmenü</h2></li>
<li>1.Punkt</li>
<li>2.Punkt</li>
<li>3.Punkt</li>
<li>4.Punkt</li>
<li>5.Punkt</li>
<li>6.Punkt</li>
<li><h2><a href="#">Kontakt</a></h2>
<ul>
<li><a href="#>Kontakt1</a></li>
<li><a href="#">Kontakt2</a></li>
<li><a href="#">Formular</a></li>
</ul>
</li>
</ul>
</div><!-- Ende menu !-->
<!-- Ende Navigation !-->
</div><!-- Ende Container !-->
</body>
</html>
Wo ist der Fehler für die Anzeige im IE???
Kann jemand helfen?!
-
Hi
Wo ist der Fehler für die Anzeige im IE???
Der Fehler beim IE ist, dass er das CSS:hover attribut nur bei Links akzeptiert.
Kann jemand helfen?!
die Lösung ist mouseover="function() {this.style.zIndex = 5;}"
THX
--
ie:} fl:( br:> va:) ls:& fo:# rl:( n4:? ss:) de:] js:| ch:? sh:) mo:? zu:)
------------------------------
lieber ein Pinguin der läuft
als ein Fenster das hängt
-------------------------------
Hi
Wo ist der Fehler für die Anzeige im IE???
Der Fehler beim IE ist, dass er das CSS:hover attribut nur bei Links akzeptiert.Kann jemand helfen?!
die Lösung ist mouseover="function() {this.style.zIndex = 5;}"THX
Danke für Deine Mühe, bin in Sachen JavaScript noch nicht so fit.Wo baue ich das genau ein. Bin schon völlig gestresst wegen dem PROBLEM!
-
Hi
Danke für Deine Mühe, bin in Sachen JavaScript noch nicht so fit.Wo baue ich das genau ein. Bin schon völlig gestresst wegen dem PROBLEM!
ich weiss jetzt nicht genau welches div du verändern willst, den MouseEvent musst du in das entspechende Tag schreiben z.B.
<div id="container" onmouseover="machwas(this)">
jetzt kannst du ein JavascriptFunktion erstellen, wo du mit dem div alles mögliche anstellen kannst:
function machwas(damit)
{
damit.style.zIndex = 5;
}Hier findest du z.B. alle style eigenschaften die du so verändern kannst.
THX
--
ie:} fl:( br:> va:) ls:& fo:# rl:( n4:? ss:) de:] js:| ch:? sh:) mo:? zu:)
------------------------------
lieber ein Pinguin der läuft
als ein Fenster das hängt
-------------------------------
Hi
Danke für Deine Mühe, bin in Sachen JavaScript noch nicht so fit.Wo baue ich das genau ein. Bin schon völlig gestresst wegen dem PROBLEM!
ich weiss jetzt nicht genau welches div du verändern willst, den MouseEvent musst du in das entspechende Tag schreiben z.B.
<div id="container" onmouseover="machwas(this)">
jetzt kannst du ein JavascriptFunktion erstellen, wo du mit dem div alles mögliche anstellen kannst:
function machwas(damit)
{
damit.style.zIndex = 5;
}Hier findest du z.B. alle style eigenschaften die du so verändern kannst.
THX
Tja, im div-tag menu soll wenn die mouse auf kontakt kommt die nächste ul aufklappen (Kontakt1,.....).hab getestet (ie mac (mit mac user)) will aber leider nicht.
könntest Du in den folgenden quellcode ändern?
muss jacascript in den header?
<div id="menu">
<ul>
<li><h2>Hauptmenü</h2></li>
<li>1.Punkt</li>
<li>2.Punkt</li>
<li>3.Punkt</li>
<li>4.Punkt</li>
<li>5.Punkt</li>
<li>6.Punkt</li>
<li><h2><a href="#">Kontakt</a></h2>
<ul>
<li><a href="#>Kontakt1</a></li>
<li><a href="#">Kontakt2</a></li>
<li><a href="#">Formular</a></li>
</ul>
</li>
</ul>
</div><!-- Ende menu !-->
<!-- Ende Navigation !-->
-
-
-
-
Hallo.
Wo ist der Fehler für die Anzeige im IE???
Der Fehler ist im IE selbst. Er kennt :hover nur für a-Tags.
Kannst du versuchen Alternativen zu dieser Art des Menüs zu finden - z.B. über Javascript, oder Du grenzt die IE-Minderheit aus ;-)
Grüße aus Würzburg
Julian -
Begrüßung ('Hallo'),
div#menu ul ul...^ ^
Damit formatiert man valid die zweite Liste im
div#menu?
Ist nur eine Frage meinerseits, weil ich denke das ist falsch. Berichtigt mich bitte.
Ich kenne das nur so:div#menu ul li ul ...AufWiedersehen ('Vielen Dank'),
LG
--
kEv*
------
kevin
geboren am: o8.o7.2oo6
Gewicht: 3660g
---
SELFCODE:
---
sh:( fo:| ch:? rl:° br:^ ie:{ mo:| va:) de:] zu:) ss:| ls:[ js:|
---
-
Hallo kEv*.
div#menu ul ul...
^ ^Damit formatiert man valid die zweite Liste im
div#menu?Ganz Recht.
Ist nur eine Frage meinerseits, weil ich denke das ist falsch. Berichtigt mich bitte.
Ich kenne das nur so:div#menu ul li ul ...
Dies wäre auch möglich, aber unnötiger Aufwand. Beispiel: ~~~html <ul> <li>Foo</li> <li> <ul> <li>Bar</li> <li>Baz</li> </ul> <li>Qux</li> </ul>Letztendlich befindet sich das zweite ul-Element im ersten; dass sich dazwischen noch ein li-Element befindet, interessiert bei obigem Selektor nicht weiter. Er trifft auf ein ul-Element zu, welches sich beliebig tief verschachtelt irgendwo in einem ul-Element befindet.
Relevant wäre das ganze nur, wenn man den Kindselektor nutzen würde. Hier ist die Verschachtelung von Bedeutung.
Einen schönen Sonntag noch.
Gruß, Mathias
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
debian/rules-
Hallo nochmal.
<ul>
<li>Foo</li>
<li>
<ul>
<li>Bar</li>
<li>Baz</li>
</ul>
<li>Qux</li>
</ul>Korrektur: ~~~html <ul> <li>Foo</li> <li> <ul> <li>Bar</li> <li>Baz</li> </ul> </li> <li>Qux</li> </ul>Einen schönen Sonntag noch.
Gruß, Mathias
--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
debian/rules
-
-