CSS展开，隐藏悬停内容

Container div包含浮动的左侧框（大小相同），因此看起来像网格。一个盒子有一个可见的内容和隐藏的内容。我想将鼠标悬停并查看展开的隐藏内容，以便它保持在任何其他框的顶部。CSS展开，隐藏悬停内容

除了最后一部分，我几乎可以工作 - 即使应用了z-index，隐藏的内容也不会保持在最佳状态。

2012-02-06 Vad

谢谢大家。请让我查看每个答案。 – Vad 2012-02-06 22:52:43

你需要的CSS是这样;

.item .item-1, .item .item-2{ 
    position:absolute; 
    background-color:white; 
} 
.item .item-2{ 
    display:none; 
} 
.item:hover .item-2{display:block;}

希望我帮

/编辑 - >这种方式，你甚至不需要的JavaScript ..

来源

2012-02-06 22:30:53 japrescott

+1我认为背景颜色缺失使得它不显示在没有背景颜色的顶部 – 2012-02-06 22:31:51

上，你不能清楚地看到哪一个在顶部，但那不是不要改变盒子里的“下方”。这个行为对于一个工作人员来说有什么可能性，是让这两个项目的位置：绝对值，所以他们坚持在同一个地方 – japrescott 2012-02-06 22:34:36

更改样式.item .item-2如下。

.item .item-2{ 
    display:none; 
    position:absolute; 
    top:0px; 
}

Demo

来源

2012-02-06 22:30:10 ShankarSangoli

我看不到这个修复了什么... – 2012-02-06 22:33:14

这会在隐藏的元素上带来隐藏的元素。你检查了演示链接吗？ – ShankarSangoli 2012-02-06 22:35:20

我认为OP就意味着将它与其他元素分层，就z-index而言。我可能是错误的，但我认为你可能误解了 – 2012-02-06 22:37:57

我添加透露，当隐藏要素背景颜色和z-index的...这是你是什么意思？

http://jsfiddle.net/kmacey1249/ZQ63X/3/

来源

2012-02-06 22:30:59

CSS展开，隐藏悬停内容

回答

相关问题