javascript – 如何在滚动时只运行一次jQuery动画？

我正在尝试使用Javascript来检测用户在我的网站上向下滚动超过某个高度的时间,然后我的“社交”图标一旦达到滚动断点就会淡入.

我想弄清楚的是,一旦alpha命中1并锁定它,我怎么才能运行fadeto？因此,当用户再次向上和向下滚动时,fadeIn不会一次又一次地发生,除非它们启动页面重新加载,这将重置所有内容.

//SCROLL
$(window).on("scroll", function () {
//SOCIAL ICONS
if ($(this).scrollTop() > 1750) {
    $(".img-social .gith").stop(true).fadeto(250, 1);
    $(".img-social .inst").stop(true).fadeto(450, 1);
    $(".img-social .twit").stop(true).fadeto(650, 1);
    $(".img-social .drib").stop(true).fadeto(850, 1);
    $(".img-social .link").stop(true).fadeto(1050, 1);
} else {
    $(".img-social .gith").stop(true).fadeto(10, 0);
    $(".img-social .inst").stop(true).fadeto(10, 0);
    $(".img-social .twit").stop(true).fadeto(10, 0);
    $(".img-social .drib").stop(true).fadeto(10, 0);
    $(".img-social .link").stop(true).fadeto(10, 0);
}
});

谢谢

解决方法:

在运行代码后,只需将以下代码置于第一个if条件中即可关闭滚动事件：

$(window).on("scroll.socialIcon", function () {
    if ( $(this).scrollTop() > 1750 ) {
        // ...
        $(window).off("scroll.socialIcon"); // last line
    } else {
        //...
    }
});

因此scroll.socialIcon(namespaced)事件将不再响应.