js 小问题！

FAQ20091209 2010-01-15 08:20:07

举例如下：
<div><a id="A1" href="#"></a></div>
<div><a id="B2" href="#"></a></div>

<div id="divlayer">显示层</div>
------
1,当鼠标移到 A1 时，需要显示 divlayer
2,当鼠标移出 A1 时，需要隐藏 divlayer
3,当鼠标由 A1 移到 B2 时，保持 divlayer 的显示（不要重新显示出来）
4,当鼠标移出 B2 时，需要隐藏 divlayer

...全文

122 10 打赏收藏举报

写回复

10 条回复

切换为时间正序

当前发帖距今超过3年，不再开放新的回复

发表回复

浴火_凤凰 2010-01-18

打赏
举报

自己写的最满意

zhouwei7682719 2010-01-17

打赏
举报

有答案了，还不结贴啊？

FAQ20091209 2010-01-17

打赏
举报

Click_Me 你错了
每个<li>都有自己对应的 dialayer 你把触发点放在ul上，试问你如何针对单个li显示对应的层呢？

Click_Me 2010-01-17

打赏
举报



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

 <head>

  <title> new document </title>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

  <style>

    body{margin:0px;padding:0px;}

	#ulRegName {list-style:none;width:60px;}

	#ulRegName li { list-style:none;width:60px;height:25px;border:1px solid #CDCDCD;}

	#divlayer {width:100px;height:100px;background-color:#00CC33;display:none}

  </style>

 </head>



 <body>

	<ul id="ulRegName"> 

		<li id="li1">列表一</li> 

		<li id="li2">列表二</li> 

		<li id="li3">列表三</li> 

	</ul> 

	<div id="divlayer">显示层 </div> 

	<script type="text/javascript">

		window.onload = function(){

			var o = document.getElementById('ulRegName');

			var l = document.getElementById('divlayer');

			o.onmouseover = function(){ l.style.display = 'block' };

			o.onmouseout = function(){l.style.display = 'none'};

		}



	</script>

 </body>

</html>

FAQ20091209 2010-01-17

打赏
举报

这个答案我测试过了，鼠标由 li1 区域移入 divlayer 区域时，divlayer 会被消失！

FAQ20091209 2010-01-16

打赏
举报

FAQ20091209 2010-01-16

打赏
举报

纠正一下儿我的问题！！！
------
<div class="leftmenu">
<ul id="ulRegName">
<li id="li1"></li>
<li id="li2"></li>
<li id="li3"></li>
</ul>
</div>
<div id="divlayer">显示层 </div>
------
1 当鼠标进入 li1 时 divlayer 显示出来；
2 当鼠标由 li1 移入 divlayer 时，dirlayer 保持显示状态不变；
3 当鼠标离开 divlayer 时，divlayer 隐藏；
4 当鼠标离开 li1 进入 li2 或者 li3 时 divlayer 被重新显示出来；
以上机制应对每个 li

luohuayh 2010-01-16

打赏
举报

[Quote=引用 1 楼 xmliy 的回复:]
JScript codevar a1= document.getElementById('A1'),
b2= document.getElementById('B2'),
div= document.getElementById('divlayer');
a1.onmouseover=function() { div.style.display=''?-
[/Quote]
正解

wl_ldy 2010-01-15

打赏
举报

路过学习。。。

xmliy 2010-01-15

打赏
举报



     var a1 = document.getElementById('A1'), 

         b2 = document.getElementById('B2'),

         div = document.getElementById('divlayer');

     a1.onmouseover = function() { div.style.display = ''; }

     a1.onmouseout = function(e) {

         e = e || window.event;

         var related = e.toElement ? e.toElement : e.relatedTarget;

         if (related == b2) return;

         div.style.display = 'none';

     }

     b2.onmouseout = function() { div.style.display = 'none'; }