jquery - jqueryを使用して他のdivが画面に表示されていないときにdivを表示する方法は?

Question

jqueryを使用して画面に表示されていないdiv#myDiv-1ときに表示する必要がありますdiv#myDiv-2

ページが読み込まれるdiv#myDiv-2と が表示され、訪問者が下にスクロールしてが表示されdiv#myDiv-2なくなるdiv#myDiv-1と が表示されます。

申し訳ありませんが、コードを投稿していませんが、開始方法がわかりません。

Answer 1

hideイベントをバインドできます。

$('#myDiv-2').on('hide',function(){
    $('#myDiv-1').show();
});

Answer 2

別の要素が画面からスクロールされたときに、ある要素を表示するには、次のようにします。

$(window).on('scroll', function() {
    var y  = $(window).scrollTop(),
        e1 = $('#myDiv-1'),
        e2 = $('#myDiv-2'),
        vi = e1.offset().top < (y + $(window).height()) && (e1.offset().top + e1.height()) > y;

    e2.toggle(!vi);
});

フィドル

Answer 3

試す、

$(function(){
    $('div#myDiv-2').show();
    $('div#myDiv-1').hide();
    $(window).scroll(function(){
       if($('div#myDiv-2').is(":visible"))
       {
           $('div#myDiv-1').show();// shows the first div
           $('div#myDiv-2').hide();// hide the second div
       }
    });
});

フィドル

Answer 4

あなたはこれを行うことができます、

$(window).scroll(function(){
    if(!$("#myDiv-2").is(":visible")){
         $("#myDiv-1").show();
    }
});