标题不是很贴切,想不出怎么来概括,
动态的创建了div块(div2)、A标签(as),并且将A标签插入到dvi2中,当鼠标移进div1时,将div2插入到div1中。
我要的效果是当鼠标移进div1时显示div2,当点击dvi2里面的A标签时跳转到指定的url。
这方法在火狐下可以正常链接,IE却不行,有什么好的方法能解决IE下问题呢?大家看源码:<!doctype html>
<html>
<head>
<title>Test</title>
<style type="text/css">
#div1{
width:200px;
height:200px;
background:#ccc;
border:1px solid #333;
}
.div2{
width:100px;
height:100px;
background:#fff;
border:1px solid #333;
}
.as{background:#c60;}
</style>
</head>
<body> <div id="div1"></div><script>
var div1=document.getElementById("div1");
var div2=document.createElement("div");
div2.className="div2";
var as=document.createElement("a");
as.className="as";
as.href="http://www.baidu.com";
as.innerHTML="点击我吧";
//触发事件
div1.onmouseover=function (){
this.appendChild(div2);
div2.appendChild(as);
stopBubble(this);
}
</script>
</body>
</html>
动态的创建了div块(div2)、A标签(as),并且将A标签插入到dvi2中,当鼠标移进div1时,将div2插入到div1中。
我要的效果是当鼠标移进div1时显示div2,当点击dvi2里面的A标签时跳转到指定的url。
这方法在火狐下可以正常链接,IE却不行,有什么好的方法能解决IE下问题呢?大家看源码:<!doctype html>
<html>
<head>
<title>Test</title>
<style type="text/css">
#div1{
width:200px;
height:200px;
background:#ccc;
border:1px solid #333;
}
.div2{
width:100px;
height:100px;
background:#fff;
border:1px solid #333;
}
.as{background:#c60;}
</style>
</head>
<body> <div id="div1"></div><script>
var div1=document.getElementById("div1");
var div2=document.createElement("div");
div2.className="div2";
var as=document.createElement("a");
as.className="as";
as.href="http://www.baidu.com";
as.innerHTML="点击我吧";
//触发事件
div1.onmouseover=function (){
this.appendChild(div2);
div2.appendChild(as);
stopBubble(this);
}
</script>
</body>
</html>
<html>
<head>
<title>Test</title>
<style type="text/css">
#div1{
width:200px;
height:200px;
background:#ccc;
border:1px solid #333;
}
.div2{
width:100px;
height:100px;
background:#fff;
border:1px solid #333;
}
.as{background:#c60;}
</style>
</head>
<body> <div id="div1"></div><script>
var div1=document.getElementById("div1");
var div2=document.createElement("div");
div2.className="div2";
var as=document.createElement("a");
as.className="as";
as.href="http://www.baidu.com";
as.innerHTML="点击我吧";
//触发事件
div1.onmouseover=function (){
this.appendChild(div2);
div2.appendChild(as);
stopBubble(this);
}
</script>
</body>
</html>
div1.onmouseover=function (){
this.appendChild(div2);
div2.appendChild(as);
stopBubble(this); //抱歉,这条是无用语句,发帖时忘删了;
}
var div2=document.createElement("div");
div2.className="div2";
var as=document.createElement("a");
as.className="as";
as.href="http://www.baidu.com";
as.innerHTML="点击我吧";
var add=false
//触发事件
div1.onmouseover=function (){
if(!add){/////判断下是否已经添加过,添加过就不要重复加了,IE好像重复执行onmouseover导致链接失效
this.appendChild(div2);
div2.appendChild(as);
add=true
// stopBubble(this);
}
}