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
  • 打赏
  • 举报
回复
<ul id="ulRegName">
<li id="li1"> </li>
<li id="li2"> </li>
<li id="li3"> </li>
<...可能会有很多个>
</ul>
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'; }
发帖
JavaScript

8.7w+

社区成员

Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
帖子事件
创建了帖子
2010-01-15 08:20
社区公告
暂无公告