使多个图像在不同的页面位置jquery淡入

Question

我正试图在某个页面位置进行img淡入淡出，然后在另一个页面位置再次进行img淡入淡出...我怎样才能实现这一点，我的代码如下所示。现在我只将它设置为一个img，无法弄清楚如何添加具有不同页面位置的第二个。

var startY = 20

$(window).scroll(function(){
checkY();
});

function checkY(){
if( $(window).scrollTop() > startY ){
    $('#head_bar').fadeIn();
}else{
    $('#head_bar').fadeOut();
}
}

// Do this on load just in case the user starts half way down the page
checkY();

Answer 1

我让这个工作，不确定它是否可靠，适用于safari chrome和firefox ......

var startY = 20
var startX = 170

$(window).scroll(function(){
checkY();
});

function checkY(){
if( $(window).scrollTop() > startY ){
    $('#head_bar').fadeIn();
if($(window).scrollTop() > startX ) 
    $('#video_img').fadeIn();
}else{
    $('#head_bar').fadeOut();
    $('#video_img').fadeOut();

}
}