HTML-Code:
<!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="en" lang="en" >
<head>
<meta http-equiv="content-type" content="text/html; charset=utf8" />
<meta name="verify-v1" content="pXbNGSs3/eWDfbLBjoSaY/XUGdhDThn+0u5dgaMf6O0=" />
<meta name="verify-v1" content="kr2ZI5Q5UWO+WLRGo9FdpASr4j18UMctBIv+c1iqrL0=" />
<title> Golf Elite Berlin</title>
<meta name="description" content="Golf-Elite-Berlin" />
<link rel="shortcut icon" href="http://i231.photobucket.com/albums/ee76/deadboy_bucket_bucket/WEB%20test%20closeded/iconvwlinks.png" type="image/x-icon" />
<script type="text/javascript" >
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript" >
try {
var pageTracker = _gat._getTracker("UA-6488330-1");
pageTracker._trackPageview();
} catch(err) {}</script>
<head> <title> menu</title> <script type="text/javascript" src="chrome.js" > </script>
<script type="text/javascript" src="jquery.js" > </script>
<style>
#MainMenu
{
height:37px;
border:0;
margin:0;
}
#tab
{
top:0;
height:0;
background:repeat-x top;
margin:0;
}
#tab ul
{
overflow:hidden;
height:37px;
list-style:none;
float:left;
margin:0;
padding:0;
}
#tab li
{
display:inline;
float:left;
margin:0;
padding:0;
}
#tab div span
{
background:url(images/bleft_109.gif) no-repeat left top;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#fff;
font-weight:700;
display:block;
line-height:37px;
padding:0 20px 0 25px;
}
#tab div
{
cursor:pointer;
border:0;
background:url(images/bright_109.gif) no-repeat right top;
}
#tab a
{
background:url(images/bright_109.gif) no-repeat right top;
text-decoration:none;
border:0;
display:block;
float:left;
margin:0;
padding:0;
}
#tab a span
{
display:block;
background:url(images/bleft_109.gif) no-repeat left top;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#fff;
font-weight:700;
line-height:37px;
padding:0 20px 0 25px;
}
#tab a:hover,#tab li.item_active a
{
background-position:right bottom;
}
#tab a:hover span,#tab li.item_active a span
{
background-position:left bottom;
color:#00bff3;
font-weight:700;
font-style:normal;
text-decoration:none;
}
.dropmenudiv
{
position:absolute;
top:0;
float:left;
display:block;
visibility:hidden;
border:0 #005b7e;
color:#fff;
z-index:100;
text-decoration:none;
padding:0;
}
.dropmenudiv ul
{
list-style:none;
margin:0;
padding:0;
}
.dropmenudiv li
{
display:inline;
margin:0;
padding:0;
}
.dropmenudiv a:link,.dropmenudiv a:visited
{
width:180px;
display:block;
border:0;
color:#fff;
background:url(images/bleft_109.gif) no-repeat left top;
font-weight:700;
font-style:normal;
text-decoration:none;
margin:0;
padding:0;
}
.dropmenudiv a span
{
display:block;
line-height:37px;
background:url(images/bright_109.gif) no-repeat right top;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#fff;
float:none;
padding:0 20px 0 25px;
}
.dropmenudiv a:hover
{
border:0;
background-position:left bottom;
font-weight:700;
font-style:normal;
text-decoration:none;
color:#00bff3;
}
.dropmenudiv a:hover span
{
background-position:right bottom;
color:#00bff3;
font-weight:700;
}
</style> </head> <body>
<div id="MainMenu" >
<div id="tab" >
<ul>
<li class="item_active" > <a href="home.html" > <span> Home</span> </a> </li>
<li> <a href="Media.html" > <span> Media</span> </a> </li>
<li> <a href="Awards.html" > <span> Awards</span> </a> </li>
<li> <a href="Programm.html" > <span> Programm</span> </a> </li>
<li> <a href="Gaestebuch.html" > <span> Gaestebuch</span> </a> </li>
<li> <a href="Kontakt.html" > <span> Kontakt</span> </a> </li>
</ul>
</div>
</div>
<script type="text/javascript" >
jQuery(function(){
$("#tab li").prepend("<div> </div> "); //Throws an empty span tag right before the a tag
$("#tab li").each(function() { //For each list item...
var linkText = $(this).find("a").html(); //Find the text inside of the a tag
$(this).find("div").show().html(linkText); //Add the text in the span tag
});
$("#tab li").hover(function() { //On hover...
$(this).find("div").stop().animate({
marginTop: "-37" //Find the span tag and move it up 40 pixels
}, 250);
} , function() { //On hover out...
$(this).find("div").stop().animate({
marginTop: "0" //Move the span back to its original state (0px)
}, 250);
});
});
</script>
</body> </html> 
Zitieren