JQuery 事件只运行一次，不会重复

Question

我有一个 JQuery 事件，我想在每次滚动鼠标时重复该事件。目前它将运行一次，添加 css 然后似乎完全不活动。

我只是在学习 JQuery，我最初使用的是 .scroll，但是即使一次也不会应用 css，所以我没有将 .bind 与鼠标滚轮一起使用。我已经尝试了 .onclick 事件，但这也是一样的，我真的不知道还能尝试什么。

$(document).ready(function () {
    $(window).bind('mousewheel', function() {
        $(".perspective-line p").css({
            transform: 'translate(0, -50px)',
        });
    });
});

我的文本被变换了一次 50 像素，但它只是卡在那里，我希望它在滚动鼠标滚轮时再次变换。

编辑*新脚本

$(document).ready(function () {
    var increasedValue = 0;
    $(window).bind('mousewheel', function() {
        increasedValue += 50;
        $(".perspective-line p").css({
            transform: 'translate(0, -${increasedValue}px)',
        });
        console.log(increasedValue)
    });
});

Answer 1

事件照常触发。您将固定值设置为 CSS您可以尝试使用动态设置进行类似的操作:

$(document).ready(function () {
    var increasedValue = 20; 
    $(window).bind('mousewheel', function() {
    increasedValue ++;
        $(".perspective-line p").css({
            transform: `translate(0, -${increasedValue}px)`,
        });
    });
});