js统制div交叉显示
日期：2014-05-16 浏览次数：20433 次
js控制div交叉显示
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>无标题页</title>
<script>
function showXs()
{
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="block";
}
function showOut()
{
document.getElementById('div1').style.display="block";
document.getElementById('div2').style.display="none";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="div1" style="width:500px; height:300px; background-color:#000;" onmousemove="showXs()">
</div>
<div id="div2" style="width:500px; height:300px; background-color:Red; display:none" onmouseout="showOut()">
<div style="width:50%; height:100%; float:left; background-color:Fuchsia"></div>
<div style="width:50%; height:100%; float:left; background-color:Green"></div>
</div>
</form>
</body>
</html>
这个就是当鼠标移到div1时候div1隐藏，div2显示，当鼠标移除div2的时候div1显示，div2隐藏
但是现在问题是当鼠标在div2的两个颜色之间移动的时候会闪动，该怎么搞可以不闪动啊？
------解决方案--------------------
onmousemove = "showXs()"
你在div2里面，再加上这个，就可以了，这个应该算是在事件捕获的时候，先触发了div2的onmouseout，具体怎么说，也说不好、、、你可以在div2之下的每个div中都加入一个omouseout事件，用alert打印，就可以看出哪一个onmouseout被先触发了。
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>无标题页</title>
<script>
function showXs()
{
document.getElementById('div1').style.display="none";
document.getElementById('div2').style.display="block";
}
function showOut()
{
document.getElementById('div1').style.display="block";
document.getElementById('div2').style.display="none";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="div1" style="width:500px; height:300px; background-color:#000;" onmousemove="showXs()">
</div>
<div id="div2" style="width:500px; height:300px; background-color:Red; display:none" onmouseout="showOut()">
<div style="width:50%; height:100%; float:left; background-color:Fuchsia"></div>
<div style="width:50%; height:100%; float:left; background-color:Green"></div>
</div>
</form>
</body>
</html>
这个就是当鼠标移到div1时候div1隐藏，div2显示，当鼠标移除div2的时候div1显示，div2隐藏
但是现在问题是当鼠标在div2的两个颜色之间移动的时候会闪动，该怎么搞可以不闪动啊？
div
function
html
------解决方案--------------------
onmousemove = "showXs()"
你在div2里面，再加上这个，就可以了，这个应该算是在事件捕获的时候，先触发了div2的onmouseout，具体怎么说，也说不好、、、你可以在div2之下的每个div中都加入一个omouseout事件，用alert打印，就可以看出哪一个onmouseout被先触发了。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
