jquery如何实现3个div,有2个float:left的div;当第一个div聚焦的时候,有一个div出现在第二个div的位置
有3个div,有2个float:left的div;当第一个divonblur的时候,有一个div出现在第二个div的位置,(不是替代,是挡住一部分)...
有3个div,有2个float:left的div;当第一个div onblur的时候,有一个div出现在第二个div的位置,(不是替代,是挡住一部分)
展开
2个回答
展开全部
3个div
<div id="div1"></div><div id="div2"></div><div id="div3"></div>
通过CSS定位前两个为浮动，最后一个为定位
div{width:200px;height:200px;}
#div1{float:left;background-color:red;}
#div2{float:left;background-color:blue;}
#div3{position:absolute;left:260px;top:20px;background-color:gray;display:none;z-index:9;}JQuery：
$(function(){
$("#div1").hover(function(){
$("#div3").show("fast");
}, function(){
$("#div3").hide();
});
});可以自己试一下
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html>
<head>
<title>Enter the title of your HTML document here</title>
<script type="text/javascript">
function aa()
{
document.getElementById("div3").style.display="block";
}
function bb()
{
document.getElementById("div3").style.display="none";
}
</script>
</head>
<body style="width:900px">
<div id="div1" style="width:300px; background-color:red;height:200px; float:left" onmouseover="aa()" onmouseout = "bb()">
</div>
<div id="div2" style="width:300px; background-color:green;height:200px; float:left">
</div>
<div id="div3" style="width:200px; background-color:blue;height:200px;position:absolute; left:350px;display:none; z-index:100">
</div>
</body>
</html>
<head>
<title>Enter the title of your HTML document here</title>
<script type="text/javascript">
function aa()
{
document.getElementById("div3").style.display="block";
}
function bb()
{
document.getElementById("div3").style.display="none";
}
</script>
</head>
<body style="width:900px">
<div id="div1" style="width:300px; background-color:red;height:200px; float:left" onmouseover="aa()" onmouseout = "bb()">
</div>
<div id="div2" style="width:300px; background-color:green;height:200px; float:left">
</div>
<div id="div3" style="width:200px; background-color:blue;height:200px;position:absolute; left:350px;display:none; z-index:100">
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
