hallo hab folgendes Problem
möchte gerne mit jquery beim mouseover auf home tab5 mit einem Fade anzeigen lassen. Und beim mouseout soll es sich wieder schließen.
Mein Problem ist es, dass es sich beim Mouseout zwar schließt, ich deswegen aber nicht auf tab5 klicken kann da er schon verschwunden ist.
kann mir wer weiterhelfen ?
http://dominiksblog.bplaced.net/fadetest.html
code
möchte gerne mit jquery beim mouseover auf home tab5 mit einem Fade anzeigen lassen. Und beim mouseout soll es sich wieder schließen.
Mein Problem ist es, dass es sich beim Mouseout zwar schließt, ich deswegen aber nicht auf tab5 klicken kann da er schon verschwunden ist.
kann mir wer weiterhelfen ?
http://dominiksblog.bplaced.net/fadetest.html
code
HTML:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#nav_home').mouseenter(function() {
$('#tab5').fadeIn();
});
$('#tab5').mouseleave(function() {
$('#tab5').fadeOut();
});
$('#nav_home').mouseleave(function() {
$('#tab5').fadeOut();
})
});
</script>
<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
overflow:hidden;
}
li
{
float:left;
}
a:link,a:visited
{
display:block;
width:120px;
font-weight:bold;
color:#FFFFFF;
background-color:orange;
text-align:center;
padding:4px;
text-decoration:none;
text-transform:uppercase;
}
a:hover,a:active
{
background-color: gray;
}
#nav {
margin-top: 100px;
}
#tab5 {
margin-left: 0px;
display: none;
position: fixed;
margin-top: -25px;
}
</style>
</head>
<body>
<div id="nav">
<div id="tab5"><a href="#">Tab5</a></div>
<ul>
<li><a id="nav_home" href="#home">Home</a></li>
<li><a href="#news">News</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#about">About</a></li>
</ul>
</div>
</body>
</html>