4

私は次のHTMLを持っています

<div class="individual">
    <div class="change">change</div>
    <div class="picture"><img src....></div>
</div>

.change持っているとposition: absolute;見えない。マウスオーバー.pictureでは.change表示し、マウスアウトでは非表示にします。個人がクリックする.changeと、何かが起こるはずです。

現在、マウスが変更を超えると、画像のマウスアウトとして扱われるため、変更がちらつき始めます。

次に、このjQueryを作成しました。

$('.change').mouseout(function(){
    $('.picture').mouseout(function(){
        $(this).parent().children('.change').hide();
    });
});

$('.picture').mouseover(function(){
    var i = $(this).parent().children('.change').show();
});

これは初めて正常に動作します！写真を外して、また戻って着替えると、すべてがちらつき始めます!! 私は何をしますか？！

ありがとう

4

4 に答える 4

17

「mouseover」の代わりに「mouseenter」を、「mouseout」の代わりに「mouseleave」を使用する

$('.picture').mouseenter(function(){
   $(this).parent().children('.change').hide();
});



$('.picture').mouseleave(function(){
    var i = $(this).parent().children('.change').show();
});
于 2013-02-26T09:54:21.847 に答える
3

私はいつも、mouseout と mouseover がかなりバグがあることに気づきました。理由がわからない場合は、次を試してください。

$(function() { 
    $('.picture').hover(function() {
        $('.change').show();
    },function() { $('.change').hide(); });
});

「.change」の外観が「.picture」を移動せず、ホバーが壊れない限り、これはうまくいくはずです。

于 2013-02-26T10:02:34.857 に答える
1

問題は、非表示にすると要素が以前の場所に.change移動することです。これは両方をトリガーするため、置き換える必要はありません。.picture.change.mouseover().mouseenter()

.change削除しても移動しないように、両方の要素の CSS 配置を絶対に変更する必要があります.picture

于 2013-02-26T09:56:28.760 に答える