htmlexperte1+
Neues Mitglied
Gut das Vertikale krieg ich ja noch hin aber das Horizontale haut nicht hin und hab auch keinen plan...
"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"Vertikal:"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-
---------------------------------------------------------------------HTML-----------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TITLE</title>
<link type="text/css" rel="stylesheet" href="../css/css.css">
<!-- Popup & Whitespace Bugfix für IE7 -->
<!--[if lte IE 7]><style type="text/css">
#navi a {
min-height: 0;
}
* html #navi a {
height: 1px;
}
#navi li:hover {
text-indent: 0;
}
</style><![endif]-->
<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("navi").
getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls.onmouseover=function() {
this.className+=" sfhover";
}
sfEls.onmouseout=function() {
this.className=this.className.replace(new
RegExp(" sfhover\b"), "");
}}}
if (window.attachEvent) window.attachEvent("onload",
sfHover);
</script>
</head>
<body>
<ul id="navi">
<li><a href="#">Seite 1</a>
<ul>
<li><a href="#">Seite 1.1</a></li>
<li><a href="#">Seite 1.2</a></li>
<li><a href="#">Seite 1.3</a></li>
</ul>
</li>
<li><a href="#">Seite 2</a>
<ul>
<li><a href="#">Seite 2.1</a></li>
<li><a href="#">Seite 2.2</a></li>
<li><a href="#">Seite 2.3</a></li>
</ul>
</li>
</ul>
</body>
</html>
----------------------------------------------------------------------CSS------------------------------------------------------------------
* {
}
#navi ul {padding:0;
margin:0;
}
#navi {padding:0;
margin:0;
}
#navi li {float:left;
width:9em;
position:relative;
list-style-type:none;
}
#navi li ul a {margin-left:1em;
}
#navi li ul {left: -9999px;
position: absolute;
}
#navi li:hover ul {left: auto;
}
#navi {
font-family: Verdana;
}
#navi li a,
#navi li a:link,
#navi li a:active,
#navi li a:visited {
display: block;
padding: 5px 10px;
color: #000;
background-color: #ccc;
text-decoration: none;
}
#navi li a:hover {
color: #fff;
background-color: #000;
}
#navi li ul a,
#navi li ul a:link,
#navi li ul a:active,
#navi li ul a:visited {
display: block;
margin-left: 1em;
padding: 5px 10px;
color: #000;
background-color: #ddd;
text-decoration: none;
}
#navi li ul a:hover {
color: #fff;
background-color: #000;
}
"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"Horizontal:"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-
---------------------------------------------------------------------HTML-----------------------------------------------------------------
----------------------------------------------------------------------CSS------------------------------------------------------------------
____________________________________________________________________________________________________
Gut das Vertikale krieg ich ja noch hin aber das Horizontale haut nicht hin und hab auch keinen plan...
"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"Vertikal:"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-
---------------------------------------------------------------------HTML-----------------------------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>TITLE</title>
<link type="text/css" rel="stylesheet" href="../css/css.css">
<!-- Popup & Whitespace Bugfix für IE7 -->
<!--[if lte IE 7]><style type="text/css">
#navi a {
min-height: 0;
}
* html #navi a {
height: 1px;
}
#navi li:hover {
text-indent: 0;
}
</style><![endif]-->
<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("navi").
getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls.onmouseover=function() {
this.className+=" sfhover";
}
sfEls.onmouseout=function() {
this.className=this.className.replace(new
RegExp(" sfhover\b"), "");
}}}
if (window.attachEvent) window.attachEvent("onload",
sfHover);
</script>
</head>
<body>
<ul id="navi">
<li><a href="#">Seite 1</a>
<ul>
<li><a href="#">Seite 1.1</a></li>
<li><a href="#">Seite 1.2</a></li>
<li><a href="#">Seite 1.3</a></li>
</ul>
</li>
<li><a href="#">Seite 2</a>
<ul>
<li><a href="#">Seite 2.1</a></li>
<li><a href="#">Seite 2.2</a></li>
<li><a href="#">Seite 2.3</a></li>
</ul>
</li>
</ul>
</body>
</html>
----------------------------------------------------------------------CSS------------------------------------------------------------------
* {
}
#navi ul {padding:0;
margin:0;
}
#navi {padding:0;
margin:0;
}
#navi li {float:left;
width:9em;
position:relative;
list-style-type:none;
}
#navi li ul a {margin-left:1em;
}
#navi li ul {left: -9999px;
position: absolute;
}
#navi li:hover ul {left: auto;
}
#navi {
font-family: Verdana;
}
#navi li a,
#navi li a:link,
#navi li a:active,
#navi li a:visited {
display: block;
padding: 5px 10px;
color: #000;
background-color: #ccc;
text-decoration: none;
}
#navi li a:hover {
color: #fff;
background-color: #000;
}
#navi li ul a,
#navi li ul a:link,
#navi li ul a:active,
#navi li ul a:visited {
display: block;
margin-left: 1em;
padding: 5px 10px;
color: #000;
background-color: #ddd;
text-decoration: none;
}
#navi li ul a:hover {
color: #fff;
background-color: #000;
}
"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"Horizontal:"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-"-
---------------------------------------------------------------------HTML-----------------------------------------------------------------
----------------------------------------------------------------------CSS------------------------------------------------------------------
____________________________________________________________________________________________________
Gut das Vertikale krieg ich ja noch hin aber das Horizontale haut nicht hin und hab auch keinen plan...