jQuery鼠标指向导航栏

<script type="text/javascript" src="/static/js/jquery-3.5.0.min.js"></script>
<script type="text/javascript">
	$(function(){
		$('body>ul>li').hover(function(){
			$(this).children('ul').slideDown(500);
		}, function(){
			$(this).children('ul').slideUp(500);
		});
	});

</script>	

	<ul>
		<li>
			<a href="#">顶级菜单一</a>
			<ul>
				<li>子菜单1</li>
				<li>子菜单2</li>
				<li>子菜单3</li>
			</ul>
		</li>
	</ul>
	<ul>
		<li>
			<a href="#">顶级菜单二</a>
			<ul>
				<li>子菜单1</li>
				<li>子菜单2</li>
				<li>子菜单3</li>
			</ul>
		</li>
	</ul>
	<ul>
		<li>
			<a href="#">顶级菜单三</a>
			<ul>
				<li>子菜单1</li>
				<li>子菜单2</li>
				<li>子菜单3</li>
			</ul>
		</li>
	</ul>