懸停效果的作品在AJAX加載的內容奇怪

這裏它的網站：http://www.webkunst.comeze.com/test/懸停效果的作品在AJAX加載的內容奇怪

如果你點擊左邊的作品，它通過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/ 其中採用CSS與.item .mask

，這是我的標記： enter image description here

我在做什麼錯了，爲什麼要這樣做？

我必須補充一點，當頁面沒有通過ajax加載時，效果很好。

來源

2012-10-12 codek

給你的.item元素position:relative css。

你絕對.art_title元素對齊到頁面的頂部（而不是到的.item

頂部

來源

2012-10-12 14:40:37

懸停效果的作品在AJAX加載的內容奇怪

回答

相關問題