请教个jq鼠标经过的二级导航菜单

一直被平均 2013-09-28 11:52:22
<script>
function initMenu() {
$('#menu ul').hide();
$('#menu li a').mouseover(
function() {
var checkElement = $(this).next();
if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
return false;
}
if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
$('#menu ul:visible').slideUp('normal');
checkElement.slideDown('normal');
return false;
}
}
);
}
$(document).ready(function() {initMenu();});
</script>
<ul id="menu">
<li>
<a href="#">Weblog Tools</a>
<ul>
<li><a href="http://www.pivotx.net/">PivotX</a></li>
<li><a href="http://www.wordpress.org/">WordPress</a></li>
</ul>
</li>
<li>
<a href="#">Programming Languages</a>
<ul>
<li><a href="http://www.php.net/">PHP</a></li>
<li><a href="http://www.ruby-lang.org/en/">Ruby</a></li>
<li><a href="http://sc.xueit.com/">Python</a></li>
<li><a href="http://www.perl.org/">PERL</a></li>
<li><a href="http://java.sun.com/">Java</a></li>
<li><a href="http://en.wikipedia.org/wiki/C_Sharp">C#</a></li>
</ul>
</li>
</ul>


这个原先是鼠标点击的效果,我给改成鼠标经过的效果了
我想变成鼠标离开后,子菜单也隐藏

我加了个
 $('.meaq1 li a').mouseout(function(){
$('.meaq1 ul:visible').slideUp('normal');
});

这个。效果不太正常。。。。

多谢了
...全文
139 3 打赏 收藏 转发到动态 举报
写回复
用AI写文章
3 条回复
切换为时间正序
请发表友善的回复…
发表回复
一直被平均 2013-09-30
  • 打赏
  • 举报
回复
真的十分感谢
fzfei2 2013-09-29
  • 打赏
  • 举报
回复
你要的是不是这效果

<script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>

 <script>
function initMenu() {
  $('#menu ul').hide();
  $('#menu li a').mouseover(
    function() {
      var checkElement = $(this).next();
      if((checkElement.is('ul')) && (checkElement.is(':visible'))) {
        return false;
        }
      if((checkElement.is('ul')) && (!checkElement.is(':visible'))) {
        $('#menu ul:visible').slideUp('normal');
        checkElement.slideDown('normal');
        return false;
        }
      }
    );

	 $('#menu ').mouseleave( function(){
	  	$('#menu ul:visible').slideUp('normal');
	  }); 
  }

  
  
  
  
$(document).ready(function() {initMenu();});
</script>
<div>
	<ul id="menu">
		<li>
			<a href="#">Weblog Tools</a>
			<ul>
				<li><a href="http://www.pivotx.net/">PivotX</a></li>
				<li><a href="http://www.wordpress.org/">WordPress</a></li>
			</ul>
		</li>
		<li>
			<a href="#">Programming Languages</a>
			<ul>
				<li><a href="http://www.php.net/">PHP</a></li>
				<li><a href="http://www.ruby-lang.org/en/">Ruby</a></li>
				<li><a href="http://sc.xueit.com/">Python</a></li>
				<li><a href="http://www.perl.org/">PERL</a></li>
				<li><a href="http://java.sun.com/">Java</a></li>
				<li><a href="http://en.wikipedia.org/wiki/C_Sharp">C#</a></li>
			</ul>
		</li>
	</ul>
</div>
阿鱼 2013-09-29
  • 打赏
  • 举报
回复
如果“.meaq1”是加在最外层ul上的话:试了下 挺正常的~

87,910

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧