0

ここにウェブサイトがあります:http://www.webkunst.comeze.com/test/

アートワークの左側をクリックすると、ページ コンテンツ (右側に表示されるアイテム) が ajax 経由で読み込まれます。私が抱えている問題は、アイテムにカーソルを合わせると、ある種の奇妙な動作をすることです。たとえば、4 ~ 9 のアイテムにカーソルを合わせると、非表示のテキストが表示されますが、最初の 3 つのアイテムでは、本当に奇妙です。

これは私が効果を行う方法です:

テキストを表示するために、これは私のメイン 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/

これは私のマークアップです: ここに画像の説明を入力

私が間違っているのはなぜですか?

ページがajax経由でロードされていない場合、効果がうまく機能することを追加する必要があります。

4

1 に答える 1

3

.item要素にposition:relativecssを与えます。

絶対.art_title要素がページの上部に配置されています (ページの上部ではなく)。.item

于 2012-10-12T14:40:37.290 に答える