如何在$(window.scroll()中运行函数一次?

如何在$(window.scroll()中运行函数一次?,scroll,scrolltop,Scroll,Scrolltop,我正在尝试制作一个页面,根据卷轴的不同启动不同的动画 原理很简单,当我在一个有关于动画类型的数据属性的块中时。我运行这个动画 为此,我的脚本基于事件$(window).scroll()。 当my$(window).scrollTop()等于我的块的位置时,我运行动画。当我离开此块时,我停止动画。我想一旦动画完成,启动一次我的重置功能。目前,她开始循环,因为我不在具有数据属性的块中 我真的卡住了。先谢谢你。马努 我的js文件: $(document).ready(init); // Ma cl

我正在尝试制作一个页面,根据卷轴的不同启动不同的动画

原理很简单,当我在一个有关于动画类型的数据属性的块中时。我运行这个动画

为此,我的脚本基于事件$(window).scroll()。 当my$(window).scrollTop()等于我的块的位置时,我运行动画。当我离开此块时,我停止动画。我想一旦动画完成,启动一次我的重置功能。目前,她开始循环,因为我不在具有数据属性的块中

我真的卡住了。先谢谢你。马努

我的js文件:

$(document).ready(init);

// Ma class Screen
function Screen(name){
    this._name = $("#"+name);
    this._hauteur;
    this._position;
    this._screenEnd;
    this._screenEnd;

    this.screenHeight = function() { 
        this._hauteur = this._name.data('height');
        return this._hauteur;
    } 

    this.topPosition = function() { 
        this._position = this._name.position().top;
        return this._position;
    } 

    this.screenEnd = function() { 
        this._screenEnd = (this._name.position().top)+(this._name.data('height'));
        return this._screenEnd;
    }
}

var mesScreens = new Array();

 $(".screen").each(function(i){
    mesScreens[i] = new Screen($(this).attr('id'));
    mesScreens[i]._name.css("height", mesScreens[i].screenHeight());
    //console.log(mesScreens[i]);
 });


var fini = false;

function init(){
    console.log($(".screen").length);

    var scrollTimer = null;
    $(window).scroll(function () {
       var monScrollTop = $(window).scrollTop();

        for (var i=0; i<mesScreens.length ; i++) {
            if(monScrollTop>(mesScreens[i].topPosition()+5) && monScrollTop<=(mesScreens[i].screenEnd()+5)){
                //started = true;
                if(mesScreens[i]._name.data("func") == "panorama"){
                    horizontalPanel(mesScreens[i]._name, mesScreens[i]._hauteur, mesScreens[i]._position);

                }else if(mesScreens[i]._name.data("func") == "anim"){
                    anim(mesScreens[i]._name, mesScreens[i]._hauteur, mesScreens[i]._position, 4);

                }
                //console.log(mesScreens[3]._hauteur);
            }else {
                        //console.log("je sors");
                        reset(mesScreens[i]._name, mesScreens[i]._hauteur);
                    }

        };
    });

}


/*
 * Function horizontalPanel
 * @screen : le screen concerné
 * @hauteur : hauteur du div
 */
function horizontalPanel(myScreen, hauteur, position){

    //console.log("Fonction horizontalPanel debut || fini = "+fini);

    var $img = myScreen.children("img");
    var deltaScroll = ($(window).scrollTop() - position);
    var scrollPercentage = ((deltaScroll / (hauteur)) * 100) ;
    //console.log(scrollPercentage);

    $img.css('position', "fixed");
    $img.css("bottom", "");
    $img.css('top', "0px");
    $img.css('left', "0px");
    $img.css("left", -scrollPercentage+"%");


}

function anim(myScreen, hauteur, position, nbImg){
    //console.log("ok");

    var $img = myScreen.children("div.image");
    var deltaScroll = ($(window).scrollTop() - position);
    var scrollPercentage = ((deltaScroll / (hauteur)) * 100) ;

    var percentNb = ((nbImg/hauteur) * 100).toFixed(2);

    for(var i=0; i<nbImg; i++){
        //console.log("if(bla)");   
    }

    //console.log("__");

    if(scrollPercentage)
    //console.log(hauteur);

    $img.css('position', "fixed");
    $img.css("top", "0px");
    $img.css("bottom", "");
    $img.css('background-position', "0 "+ scrollPercentage + '%');
    $img.css('left', "0px");
}

function reset(myScreen){

    //console.log("Fonction Reset || fini = "+fini);
    myScreen.children().css('position', "relative");
    myScreen.children().css("bottom", "0px");
    myScreen.children().css("top", "");
    myScreen.children().css("left", "");
}
$(文档).ready(初始化);
//Ma级屏幕
功能屏幕(名称){
这个._name=$(“#”+name);
这个;
这个位置;
这个(完);
这个(完);
this.screenHeight=函数(){
this._hauteur=this._name.data('height');
把这个还给我;
} 
this.topPosition=函数(){
this.\u position=this.\u name.position().top;
返回此位置;
} 
this.screenEnd=函数(){
this._screenEnd=(this._name.position().top)+(this._name.data('height');
将此返回。\u屏幕结束;
}
}
var mesScreens=新数组();
$(“.screen”)。每个(函数(i){
mesScreens[i]=新屏幕($(this.attr('id'));
mesScreens[i].\u name.css(“高度”,mesScreens[i].screenHeight());
//控制台日志(mesScreens[i]);
});
var fini=假;
函数init(){
console.log($(“.screen”).length);
var scrollTimer=null;
$(窗口)。滚动(函数(){
var monScrollTop=$(window.scrollTop();
对于(变量i=0;i)(消息[i].topPosition()+5)和&monscorltop
<div id="screen3" data-height='2300' data-func='panorama' class="screen">
    <img src="img/screen3.jpg" alt="screen-3">
</div>

<div id="screen4">
    <img src="img/screen4-2.jpg" alt="screen-4">
</div>