javascript - jQuery css() 不在条件语句中工作

Question

我正在创建一个简单的视差滚动器，它将图像缩放到屏幕宽度，设置一个滚动包装器，该包装器设置为所有图像的缩放高度，并查看 scrollTop 值以使用 jQuery 的 css 设置图像的顶部位置().这是主要功能:

function positionSlides() {
    sT = $(window).scrollTop();
    $('div.slide img').each(function(){
        wp = $(this).attr('data-waypoint');
        if(sT >= wp){
            $(this).css({'top' : wp, 'border' : '1px solid red'});
            //console.log(sT + ':sT, ' + wp + ':wp');
        }
        else{
            $(this).css({'top' : ((wp-sT)/4)+sT, 'border' : '1px solid blue'});
        }
    });
}

边框颜色的设置是为了测试哪个条件语句通过。

positionSlides() 在滚动时被调用

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

我的问题是当 sT >= wp 时，css 属性“top”没有设置为 wp 的值。它被设置为似乎是 else 语句传递的最后一个值，该值略小于 wp。但与此同时，'border' : '1px solid red' 通过相同的 if 语句正确设置。

为什么没有在语句的 if 部分设置 'top' 属性？

Answer 1

第一次使用 wp 时它不起作用，它是一个字符串。第二次，当你做wp-sT时，它是一个整数或 float 。如果您将第一个版本转换为数值，它将起作用。

var wp = parseInt($(this).attr('data-waypoint'),10);