0

这是网站:http ://www.webkunst.comeze.com/test/

如果您单击艺术品的左侧,它会通过 ajax 加载页面内容(出现在右侧的项目)。我遇到的问题是,当我将鼠标悬停在项目上时,它会出现某种奇怪的行为,例如,如果我将鼠标悬停在 4 到 9 个项目上,它会显示隐藏的文本,但在前三个项目上,这真的很奇怪。

这就是我做效果的方式:

为了显示文本,这是在我的主要 js 上:

$(function(){
    $(document).on("mouseover",".item",function(){
        $(this).find(".art_title").fadeIn(200);
     });
     $(document).on("mouseleave",".item",function(){
        $(this).find(".art_title").fadeOut(200);
     });
});

为了做黑色透明悬停效果,我正在使用本教程: http : //tympanus.net/codrops/2011/11/02/original-hover-effects-with-css3/ 它使用带有 .item .mask 的 css

这是我的标记: 在此处输入图像描述

我做错了什么,为什么会这样做?

我必须补充一点,当页面不是通过 ajax 加载时效果很好。

4

1 回答 1

3

给你的.item元素position:relativecss。

您的绝对.art_title元素与页面顶部对齐(而不是与.item

于 2012-10-12T14:40:37.290 回答