关于jq显示隐藏的效果

qq_18247769 2014-07-22 08:13:41

<html>
<a class="mune_1">按钮</a>
<span class=“second_mune” style="display:none">内容</span>
</html>

$('#mune_1').hover(function(){
$('.second_mune').show();
},function(){
$('.second_mune').hide();
})

我修改成这样，因为鼠标经过的a标签和要显示内容的span不在同一个div上，所以我鼠标指向a标签显示内容后，再移到span标签上还是会隐藏掉，怎样修改才能让鼠标移到a标签和span标签都能显示内容？？

...全文

128 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

qq_18247769 2014-07-23

打赏
举报

好的还是要谢谢

xuzuning 2014-07-23

打赏
举报

不知道！我只能满足你已提出的要求无法预测你还会做什么

qq_18247769 2014-07-23

打赏
举报

2楼的是可以

haifu23 2014-07-23

打赏
举报

不错学习一下

qq_18247769 2014-07-23

打赏
举报

三楼的加个parent()，鼠标移到其它a标签上也会显示层了，怎么解决？？

xuzuning 2014-07-23

打赏
举报

感觉加个容器比较好

<span>
    <a class="mune_1">按钮</a>
    <span class="second_mune" style="display:none">内容</span>
</span>

    $('.mune_1').hover(function(){
      $(this).parent().hover(function(){
        $('.second_mune').show();
      },function(){
        $('.second_mune').hide();
      })
    })

傲雪星枫 2014-07-22

打赏
举报


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8">
  <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <title> js test </title>
 </head>

 <body>
	<a class="mune_1">按钮</a>
	<span class="second_mune" style="display:none">内容</span>

  <script type="text/javascript">
    var et = null;
	$('.mune_1').hover(function(){
		if(et!=null){
			clearTimeout(et);
		}
		$('.second_mune').show();
	},function(){
		et = setTimeout(function(){
			$('.second_mune').hide();
			},100);	
	})
	$('.second_mune').hover(function(){
		if(et!=null){
			clearTimeout(et);
		}
		$('.second_mune').show();
	},function(){
		et = setTimeout(function(){
			$('.second_mune').hide();
			},100);	
	})	
  </script>

 </body>
</html>