链接翻转以更改背景图像

Question

滚动链接时有没有办法改变背景？即时通讯制作学位展示网站，并希望在翻转人名链接时在背景中显示大样本图像。我有一个图像出现，但它覆盖了所有文本和链接上的固定位置。有没有办法做到这一点，所以它只是改变背景图像，并留在页面上的所有其他文字后面？

继承人正在使用

#hover_img img
{
display:none;
}

#hover_img:hover img
{
display:block;
position:absolute;
top:0px;
padding-top:0px;

}

HTML

  <div id="hover_img">LINK<img src="image" alt="" /></a></div>

谢谢！

**小提琴http://jsfiddle.net/5yhsL/ **

Answer 1

将z-index：-1添加到悬停时的图像：

#hover_img:hover img
{
    display:block;
    position:absolute;
    top:0px;
    padding-top:0px;
    z-index: -1;
}

Answer 2

您可以通过将文本放在与图像元素相邻的另一个元素内来完成此操作。绝对定位的元素将占据其邻居的主导地位，并且可以通过为后续元素的position属性赋值来解决这个问题。

这是一个我掀起的jsfiddle：

http://jsfiddle.net/93mpW/3/