两个层交互有关问题
日期：2014-05-16 浏览次数：20314 次
两个层交互问题
下面是完整的HTML代码,当执鼠标放到 "显示/隐藏 "层上弹出一层,但无法点击弹出层的链接,,呵呵!(如果数据不是动态加载的则可以),帮忙看一下,谢谢!
<html>
<head>
<title> 层交互 </title>
<style>
body{text-align:center;}
#dvCon{position:absolute;width:200px;height:200px;border:1px solid #0099ff;background:#446699;visibility:hidden;z-index:1000;cursor:hand;}
#dvHiddenShow{font-size:12px;color:orange;position:absolute;width:200px;height:200px;background:#4488cc;line-height:200px;}
a{}
a:hover{}
a:visit{}
</style>
<script>
function mouseov()
{
var dv=document.getElementById( "dvCon ");
//加载数据
createCityData(dv);
dv.style.visibility= "visible ";
if(mouseov.arguments.length> 0)
{
dv.style.left=mouseov.arguments[0].offsetLeft+80;
dv.style.top=mouseov.arguments[0].offsetTop+50;
}
}
function mouseou()
{
var dv=document.getElementById( "dvCon ");
dv.innerHTML= " ";
dv.style.visibility= "hidden ";
}
function createCityData(ele)
{
for(var i=0;i <10;i++)
{
var eleTagA=document.createElement( "a ");
var eleTagBr=document.createElement( "br ");
eleTagA.href= "http:www.baidu.com ";
eleTagA.innerHTML= "www.baidu.com ";
eleTagA.onmouseover=function(){mouseov();}
eleTagA.onmouseout=function(){mouseou();}
ele.appendChild(eleTagA);
ele.appendChild(eleTagBr);
}
}
</script>
</head>
<body>
<div id= "dvCon " onmouseover= "mouseov() " onmouseout= "mouseou() ">
</div>
<div id= "dvHiddenShow " onmouseover= "mouseov(this) " onmouseout= "mouseou(this) ">
显示/隐藏
</div>
</body>
</html>
------解决方案--------------------
<html>
<head>
<title> 层交互 </title>
<style>
body{text-align:center;}
#dvCon{position:absolute;width:200px;height:200px;border:1px solid #0099ff;background:#446699;visibility:hidden;z-index:1000;cursor:hand;}
#dvHiddenShow{font-size:12px;color:orange;position:absolute;width:200px;height:200px;background:#4488cc;line-height:200px;}
a{}
a:hover{}
a:visit{}
</style>
<script>
function mouseov()
{
if(event.toElement.parentNode.id== "dvCon ")return;
var dv=document.getElementById( "dvCon ");
//加载数据
createCityData(dv);
dv.style.visibility= "visible ";
if(mouseov.arguments.length> 0)
{
dv.style.left=mouseov.arguments[0].offsetLeft+80;
dv.style.top=mouseov.arguments[0].offsetTop+50;
}
}
function mouseou()
{
if(event.toElement.parentNode.id== "dvCon ")return;
var dv=document.getElementById( "dvCon ");
dv.innerHTML= " ";
dv.style.visibility= "hidden ";
}
function createCityData(ele)
{
for(var i=0;i <10;i++)
{
var eleTagA=document.createElement( "a ");
var eleTagBr=document.createElement( "br ");
eleTagA.href= "http://www.baidu.com ";
eleTagA.innerHTML= "www.baidu.com ";
eleTagA.onmouseover=function
下面是完整的HTML代码,当执鼠标放到 "显示/隐藏 "层上弹出一层,但无法点击弹出层的链接,,呵呵!(如果数据不是动态加载的则可以),帮忙看一下,谢谢!
<html>
<head>
<title> 层交互 </title>
<style>
body{text-align:center;}
#dvCon{position:absolute;width:200px;height:200px;border:1px solid #0099ff;background:#446699;visibility:hidden;z-index:1000;cursor:hand;}
#dvHiddenShow{font-size:12px;color:orange;position:absolute;width:200px;height:200px;background:#4488cc;line-height:200px;}
a{}
a:hover{}
a:visit{}
</style>
<script>
function mouseov()
{
var dv=document.getElementById( "dvCon ");
//加载数据
createCityData(dv);
dv.style.visibility= "visible ";
if(mouseov.arguments.length> 0)
{
dv.style.left=mouseov.arguments[0].offsetLeft+80;
dv.style.top=mouseov.arguments[0].offsetTop+50;
}
}
function mouseou()
{
var dv=document.getElementById( "dvCon ");
dv.innerHTML= " ";
dv.style.visibility= "hidden ";
}
function createCityData(ele)
{
for(var i=0;i <10;i++)
{
var eleTagA=document.createElement( "a ");
var eleTagBr=document.createElement( "br ");
eleTagA.href= "http:www.baidu.com ";
eleTagA.innerHTML= "www.baidu.com ";
eleTagA.onmouseover=function(){mouseov();}
eleTagA.onmouseout=function(){mouseou();}
ele.appendChild(eleTagA);
ele.appendChild(eleTagBr);
}
}
</script>
</head>
<body>
<div id= "dvCon " onmouseover= "mouseov() " onmouseout= "mouseou() ">
</div>
<div id= "dvHiddenShow " onmouseover= "mouseov(this) " onmouseout= "mouseou(this) ">
显示/隐藏
</div>
</body>
</html>
------解决方案--------------------
<html>
<head>
<title> 层交互 </title>
<style>
body{text-align:center;}
#dvCon{position:absolute;width:200px;height:200px;border:1px solid #0099ff;background:#446699;visibility:hidden;z-index:1000;cursor:hand;}
#dvHiddenShow{font-size:12px;color:orange;position:absolute;width:200px;height:200px;background:#4488cc;line-height:200px;}
a{}
a:hover{}
a:visit{}
</style>
<script>
function mouseov()
{
if(event.toElement.parentNode.id== "dvCon ")return;
var dv=document.getElementById( "dvCon ");
//加载数据
createCityData(dv);
dv.style.visibility= "visible ";
if(mouseov.arguments.length> 0)
{
dv.style.left=mouseov.arguments[0].offsetLeft+80;
dv.style.top=mouseov.arguments[0].offsetTop+50;
}
}
function mouseou()
{
if(event.toElement.parentNode.id== "dvCon ")return;
var dv=document.getElementById( "dvCon ");
dv.innerHTML= " ";
dv.style.visibility= "hidden ";
}
function createCityData(ele)
{
for(var i=0;i <10;i++)
{
var eleTagA=document.createElement( "a ");
var eleTagBr=document.createElement( "br ");
eleTagA.href= "http://www.baidu.com ";
eleTagA.innerHTML= "www.baidu.com ";
eleTagA.onmouseover=function
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
