0
我用jQuery製作了一個導航欄,它應該在點擊時切換下拉菜單。大部分功能都是按照它應該的。e.target不能在opera中工作,chrome
$(function()
{
var tab = $(".dr-head");
var childList = $(".child-list");
tab.click(function(e)
{
e.stopPropagation();
if ($(this).children("ul").css('opacity') == '0')
{
$("ul ul").css(
{
'opacity': '0'
})
$(this).children('ul').css(
{
'opacity': '1',
'margin-top': '-15px'
}).children('li').css(
{
'display': 'list-item',
'position': 'relative',
'left': '-75px',
'padding-top': '12px'
});
}
else
{
$(this).children('ul').css(
{
'opacity': '0',
'margin-top': '0'
}).children('li').css(
{
'left': '-75px',
'padding-top': '0px'
});
}
});
$("body").click(function(e)
{
var targ = $(".nav");
if (e.target !== targ)
{
$(".dr-head").children("ul").css(
{
'opacity': '0'
});
}
})
});
<!doctype html>
<html>
<head>
<link rel="stylesheet" href="nav.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="nav.js"></script>
</head>
<body>
<nav class="nav">
<ul>
<li><a href="http://sarkelliancreed.comule.com">SarkellianCreed.com</a></li>
<li class="dr-head"><a href="#">Learn</a>
<ul>
<li><a href="http://sarkelliancreed.comule.com/learn/web-design">Web Design</a></li>
<!-- <li></li> -->
</ul>
</li>
<li class="dr-head"><a href="#">Tutorials and Snippets</a>
<ul>
<li><a href="http://sarkelliancreed.comule.com/c/snippets/">Password Generator</a></li>
</ul>
</li>
</ul>
</nav>
</body>
一切工作的權利,但是當我點擊導航欄之外,在下拉菜單不消失。我怎樣才能做到這些工作? http://sarkelliancreed.comule.com/c/new/nav
所以你說,不管我點擊是導航欄,因此不會隱藏在下拉菜單? – TricksfortheWeb
@ yak613,我編輯帖子來解釋身體的高度是如何起作用的。 – Chitrang