|
Сообщение от arwprod
|
|
$(event.target.nodeName)
|
Зачем nodeName?
Код простейший же:
<!DOCTYPE html>
<meta charset="UTF-8">
<title>Menu</title>
<style>
body {
font: 14px/24px sans-serif;
}
.nav {
height: 24px;
background: #ccc;
zoom: 1; /* IE7 clear fix */
}
.nav:after {
display: block;
overflow: hidden;
height: 0;
clear: both;
content: ".";
}
.menu {
position: relative;
float: left;
margin-right: 10px;
}
.menu .list, .menu .list li {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.menu .list {
display: none;
position: absolute;
top: 24px;
left: 0;
background: #ccf;
}
.menu .list li {
white-space: nowrap;
}
</style>
<div class="nav">
<div class="menu">
<span class="toggler">Menu 1</span>
<ul class="list">
<li><a href="#">Menu 1 item 1</a></li>
<li><a href="#">Menu 1 item 2</a></li>
<li><a href="#">Menu 1 item 3</a></li>
<li><a href="#">Menu 1 item 4</a></li>
<li><a href="#">Menu 1 item 5</a></li>
</ul>
</div>
<div class="menu">
<span class="toggler">Menu 2</span>
<ul class="list">
<li><a href="#">Menu 2 item 1</a></li>
<li><a href="#">Menu 2 item 2</a></li>
<li><a href="#">Menu 2 item 3</a></li>
<li><a href="#">Menu 2 item 4</a></li>
<li><a href="#">Menu 2 item 5</a></li>
</ul>
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(function () {
$(".menu .toggler").click(function () {
var $list = $(this).next(".list").stop();
$list.slideDown(100, function () {
$(document).one("click", function () {
$list.slideUp(100);
})
});
});
});
</script>