var vertical_count=0;
var vertical2_count=0;
var vertical_flag=0;
var fixed_head=document.getElementsByClassName("header");
count_listener();
function act(){
    setTimeout(function(){
        if(vertical_count<12){
            act();
        }
        moveVertical();
        vertical_count++;

    },100)
}
function act2(){
    setTimeout(function(){
        if(vertical2_count<27){
            act2();
        }
        moveVertical2();
        vertical2_count++;

    },70)
        }
function moveVertical(){
    Array.from(document.getElementsByClassName("vertical_item1")).forEach(function(element){
    var index = element.className.split("ver1I")[1] * 1;
    element.className = `vertical_item1 ver1I${(index-1 < 0) ? 9: index-1}`;
    })
}
function moveVertical2(){
    Array.from(document.getElementsByClassName("vertical_item2")).forEach(function(element){
    var index2 = element.className.split("ver2I")[1] * 1;
    element.className = `vertical_item2 ver2I${(index2-1 < 0) ? 9: index2-1}`;
    })
}
function count_listener(){
    setTimeout(function() {
        var count_id=document.getElementById("page-3").style.cssText;
        var count_class=document.getElementsByClassName("pg-active")[0].style.cssText;
        if(count_id==count_class){
            if(vertical_flag==0){
                act();
                act2();
                vertical_flag=1;
                console.log(count_class+" success "+count_id);
            }
        }
        else{count_listener();}   
    }, 100);


}
document.addEventListener('scroll', function() {
    var scroll_now = document.documentElement.scrollTop;
    if(scroll_now>=912){
        if(vertical_flag==0){
            act();
            act2();
            vertical_flag=1;
        }
    }
  });