Hallo,
ich wollte unter dem folgenden Menü ein Fenster für Videos, Fotos und ähnliches einbauen, jedoch weiß ich nicht genau, wie das funktionieren kann, da in diesem Menü ja Links verwendet werden. Könntet ihr mir evtl. helfen? :S
Mein Quelltext sieht bisher so aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<title>XXXX</title>
</head>
<style type="text/css">
body
{
background-image : url('Techno.jpg');
background-position : center;
background-repeat : no-repeat;
background-attachment : fixed;
background-color : #000000;
}
.menu {
font-family:
AvantGarde Bk BT;
width:450px;
height:120px;
position:center;
font-size:18px;
z-index:100;
}
.menu ul li a, .menu ul li a:visited /*Obermenü-Punkte*/
{
display:block;
font-weight:bold;
text-decoration: none;
width:104px;
height:20px;
text-align:center;
color:#fff;
border-top:0px solid #FF00FF;
border-right:0px solid #FF00FF;
border-left: 2px;
border-bottom: 3px solid #EE0000; /* Breite und Farbe des Randes*/
background:#000; /*Hintergrundfarbe des Navi*/
line-height:21px;
font-size:85%;
overflow:hidden;
}
.menu ul
{
padding:0;
margin:0;
list-style: none;
}
.menu ul li
{
float:left;
position:relative;
}
.menu ul li ul
{
display: none;
}
.menu ul li:hover a /*Obermenü beim Rübergehen mit der Maus*/
{
color:#FFD700; /*schriftfarbe der Unterpunkte*/
background:transparent;
}
.menu ul li:hover ul /*Untermenü-Positionierung und -Größe*/
{
display:block;
position:absolute;
top:22px;
left:-2px;
width:105px;
}
.menu ul li:hover ul li ul
{
display: none;
}
.menu ul li:hover ul li aa /* Untermenü Style*/
{
display:block;
background:#002;
color:#fff;
border-left: 0px solid #03f;
border-right: 1px solid #03f;
border-top: 1px solid #03f;
}
.menu ul li:hover ul li a:hover /*Unterunter-Menü-Punkte beim Rübergehen*/
{
background:transparent;
color:#FF7900; /*Farbe der Namen Beim Rübergehen*/
}
.menu ul li:hover ul li:hover ul /*Positionierung und Größe Unterunter-Menü*/
{
display:block;
position:Center;
left:105px;
top:0;
left:104px;
}
.menu ul li:hover ul li:hover ul.left
{
left:-105px;
}
</style>
<body>
<center>
<div class="menu">
<ul>
<li><a class="hide" href="#">allg. Kontakt</a>
<ul>
<li><a href="xxxx.html" target="blank" title="MSN Messanger">MSN (E-mail)</a></li>
<li></li>
</ul>
</li>
<li><a class="hide" href="">rest</a>
<ul>
<li><a href="XXXX" title="" target="blank">Lauftexte</a></li>
<li><a href="XXXX" title="" target="blank">Hintergründe</a></li>
<li><a href="XXXX" target="blank">Framesetgerüst</a></li>
</ul>
</li>
</li>
</ul>
</div>
</center>
</body>
</html>
ich wollte unter dem folgenden Menü ein Fenster für Videos, Fotos und ähnliches einbauen, jedoch weiß ich nicht genau, wie das funktionieren kann, da in diesem Menü ja Links verwendet werden. Könntet ihr mir evtl. helfen? :S
Mein Quelltext sieht bisher so aus:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 //EN">
<html>
<head>
<title>XXXX</title>
</head>
<style type="text/css">
body
{
background-image : url('Techno.jpg');
background-position : center;
background-repeat : no-repeat;
background-attachment : fixed;
background-color : #000000;
}
.menu {
font-family:
AvantGarde Bk BT;
width:450px;
height:120px;
position:center;
font-size:18px;
z-index:100;
}
.menu ul li a, .menu ul li a:visited /*Obermenü-Punkte*/
{
display:block;
font-weight:bold;
text-decoration: none;
width:104px;
height:20px;
text-align:center;
color:#fff;
border-top:0px solid #FF00FF;
border-right:0px solid #FF00FF;
border-left: 2px;
border-bottom: 3px solid #EE0000; /* Breite und Farbe des Randes*/
background:#000; /*Hintergrundfarbe des Navi*/
line-height:21px;
font-size:85%;
overflow:hidden;
}
.menu ul
{
padding:0;
margin:0;
list-style: none;
}
.menu ul li
{
float:left;
position:relative;
}
.menu ul li ul
{
display: none;
}
.menu ul li:hover a /*Obermenü beim Rübergehen mit der Maus*/
{
color:#FFD700; /*schriftfarbe der Unterpunkte*/
background:transparent;
}
.menu ul li:hover ul /*Untermenü-Positionierung und -Größe*/
{
display:block;
position:absolute;
top:22px;
left:-2px;
width:105px;
}
.menu ul li:hover ul li ul
{
display: none;
}
.menu ul li:hover ul li aa /* Untermenü Style*/
{
display:block;
background:#002;
color:#fff;
border-left: 0px solid #03f;
border-right: 1px solid #03f;
border-top: 1px solid #03f;
}
.menu ul li:hover ul li a:hover /*Unterunter-Menü-Punkte beim Rübergehen*/
{
background:transparent;
color:#FF7900; /*Farbe der Namen Beim Rübergehen*/
}
.menu ul li:hover ul li:hover ul /*Positionierung und Größe Unterunter-Menü*/
{
display:block;
position:Center;
left:105px;
top:0;
left:104px;
}
.menu ul li:hover ul li:hover ul.left
{
left:-105px;
}
</style>
<body>
<center>
<div class="menu">
<ul>
<li><a class="hide" href="#">allg. Kontakt</a>
<ul>
<li><a href="xxxx.html" target="blank" title="MSN Messanger">MSN (E-mail)</a></li>
<li></li>
</ul>
</li>
<li><a class="hide" href="">rest</a>
<ul>
<li><a href="XXXX" title="" target="blank">Lauftexte</a></li>
<li><a href="XXXX" title="" target="blank">Hintergründe</a></li>
<li><a href="XXXX" target="blank">Framesetgerüst</a></li>
</ul>
</li>
</li>
</ul>
</div>
</center>
</body>
</html>