0

次のコードは.fixed-toolbar、ユーザーがカーソルを に置いたときに、 .fixed-submit、および を表示および非表示にします。.fixed-toggle.fixed-toolbar

 $(document).on("mouseover", ".fixed-container", function(){
    $('.fullscreen .fixed-toolbar').css('visibility', 'visible');
    $(".fullscreen .fixed-submit").css('visibility', 'visible');
    $(".fullscreen .fixed-toggle .exit-fullscreen").css('visibility', 'visible');
    setTimeout(function(){ 
      $(".fullscreen .fixed-toolbar").css('visibility', 'hidden');
      $(".fullscreen .fixed-submit").css('visibility', 'hidden');
      $(".fullscreen .fixed-toggle .exit-fullscreen").css('visibility', 'hidden');
    }, 3000 ); 
  });

ユーザーがマウスを上に置いたままにしても、div は 3 秒後に消えます.fixed-toolbar。ユーザーがマウスをオンにしている限り、divが消えないようにしたいと思います.fixed-toolbar(カーソルが離れてから3秒後にのみ消えます.fixed-toolbar)。

それを達成する方法は？

4

2 に答える 2

1

試す

$(document).on("mouseover", ".fixed-container", function(){
    $('.fullscreen .fixed-toolbar, .fullscreen .fixed-submit, .fullscreen .fixed-toggle .exit-fullscreen').fadeIn();
}).on('mouseleave', '.fixed-container', function(){
    setTimeout(function(){
        $('.fullscreen .fixed-toolbar, .fullscreen .fixed-submit, .fullscreen .fixed-toggle .exit-fullscreen').fadeOut();
    }, 3000);
});
于 2013-01-12T08:59:42.873 に答える
0 
$(document).on("mouseover", ".fixed-container", function(){
    $('.fullscreen .fixed-toolbar, .fullscreen .fixed-submit, .fullscreen .fixed-toggle .exit-fullscreen').css('visibility', 'visible');
});
$(document).on("mouseout",".fixed-container",function(){
    setTimeout(function(){
    $(".fullscreen .fixed-toolbar, .fullscreen .fixed-submit, .fullscreen .fixed-toggle .exit-fullscreen").css('visibility', 'hidden');
    },3000);
});

または、 cssdisplay:none;の代わりに使用する場合:visibility:hidden;

$(document).on("mouseover", ".fixed-container", function(){
    $(".fixed-toolbar, .fixed-submit, .exit-fullscreen").show();
});
$(document).on("mouseout",".fixed-container",function(){
    setTimeout(function(){
        $(".fixed-toolbar, .fixed-submit, .exit-fullscreen").hide();
    },1000);
});

または、いくつかの組み込みの jQuery エフェクトを使用します。

$(document).on("mouseover", ".fixed-container", function(){
    $(".fixed-toolbar, .fixed-submit, .exit-fullscreen").slideDown();
});
$(document).on("mouseout",".fixed-container",function(){
    setTimeout(function(){
        $(".fixed-toolbar, .fixed-submit, .exit-fullscreen").slideUp();
    },1000);
});
于 2013-01-24T22:11:38.190 に答える