具有内容绝对位置的Fancybox

Question

我用这种方式实现了fancybox：

<a class="fancybox" rel="group" href="href">
   <img class="img-responsive" src="mysrc">
</a>
<div class="texthover">
   some text
</div>

我给了texthover div一个绝对的位置，因为我希望它完全覆盖图像，并让它对鼠标有效。但是在那个位置，绝对的fancybox停止工作，它什么也没做。如果我从该div移除绝对位置，它再次起作用。知道为什么吗？

非常感谢

Answer 1

试试这个：

$('.texthover').mouseenter(function(){
    $('.fancybox').css('z-index', 101);
});

$('.texthover').mouseleave(function(){
    $('.fancybox').css('z-index', -1);
});

Answer 2

一段时间后，我自己找到了答案。 div完全覆盖了链接，所以我只是将链接包裹在两个元素上。