0

こんにちは、ホバーにフェードイン/フェードアウト効果を実装したいと思います。表示されるテキストのカーソルの位置を維持する必要があるため、これを行うにはどうすればよいですか。

http://jsfiddle.net/u3pW8/34/

    $(function() {
    $("#static .wrapper").hover(function (e) {
        var parentOffset = $(this).parent().offset(); 
        var relX = e.pageX - parentOffset.left;
        $(this).children(".hidden-content").css("left", relX);
    });
});

助けてくれてありがとう!

4

2 に答える 2

1

CSS3 トランジションを使用します。

.hidden-content {
    position: absolute;
    opacity:0;
    display:block;
    transition: opacity 0.2s ease;
}

.wrapper:hover .hidden-content {
    opacity:1;
}

http://jsfiddle.net/u3pW8/35/

于 2013-08-23T09:06:20.647 に答える
0

コードにいくつかの変更を加えました。これはうまくいくはずです。私はとりわけこの行を追加しました:

$(this).children(".hidden-content").fadeIn('slow');

http://jsfiddle.net/u3pW8/37/

于 2013-08-23T09:10:52.120 に答える