jquery - 当使用jquery在屏幕上看不到其他div时如何显示一个div？

Question

我需要使用 jquery 在屏幕上显示div#myDiv-1不div#myDiv-2可见的时间

当页面加载div#myDiv-2可见时，当访问者向下滚动并且div#myDiv-2不再可见时，div#myDiv-1就会显示出来。

抱歉，我没有发布任何代码，但我不知道如何开始。

Answer 1

要在屏幕上滚动另一个元素时显示一个元素，您可以执行以下操作：

$(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 2

尝试，

$(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 3

你可以这样做，

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

Answer 4

您可以绑定hide事件：

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