Hab es :D
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<a href="Meine Hobbys.htm"><div id="nav_main" style="width: 6.5%; margin-left: 5%; height: auto; background-color: #FFFF00; position: absolute; text-align:center;">
Startseite
</div>
</a>
<div id="nav_yan" class="nav_button" style="width: 6.5%; margin-left: 13%; height:auto; background-color: #FFFF00; position: absolute; cursor: pointer; text-align: center;">
Yannic
<div id="nav_yan_1" class="nav_drop" style=" display: none; width: auto; cursor: pointer; text-align: center; background-color: #FFFF00; position: absolute;">
<a href="hg.htm" target="_self">Yannic 1</a>
<a href="unbekannt" target="_self">Yannic 2</a>
</div>
</div>
<div id="nav_chr" class="nav_button" style="width: 8%; margin-left: 21%; height: auto; background-color:#FFFF00; position:absolute; cursor: pointer; text-align:center;">
Christoph
<div id="nav_chr_1" class="nav_drop" style=" display: none; width: 100%; cursor: pointer; text-align: center; background-color:#FFFF00; position: absolute;">
<a href="THW.htm" target="_self">THW</a><br>
<a href="asd.htm" target="_self">Chris 2</a>
</div>
</div>
<script type="text/javascript">
$("#nav_yan").mouseenter(function(e) { $("#nav_yan_1").show(); });
$("#nav_yan").mouseleave(function() { $("#nav_yan_1").hide(); });
$("#nav_chr").mouseenter(function(e) { $("#nav_chr_1").show(); });
$("#nav_chr").mouseleave(function() { $("#nav_chr_1").hide(); });
</script>