bbh-pc/script/flow.js

let aboveDivs = [].slice.call(document.querySelectorAll(".above")),
    aboveDivsLength = aboveDivs.length,
    belowDivs = [].slice.call(document.querySelectorAll(".below")),
    belowDivsLength = belowDivs.length;
const aboveIntervalId = [],belowIntervalId = [];
const LEFT = 1,RIGHT = 2,VIEWBOXS = 6;
let viewWidth = aboveDivs[0].offsetWidth * VIEWBOXS;
let row1s = [].slice.call(document.getElementsByClassName("row1")),
    row2s = [].slice.call(document.getElementsByClassName("row2"));
row1s.forEach(element => {
    element.style.width = viewWidth;
});

for(let i = 0; i < aboveDivsLength; i++){
    console.log(i);
    let aboveInisialLeft = aboveDivs[i].offsetLeft,
        belowInisialLeft = belowDivs[i].offsetLeft;

        animate(aboveDivs[i],LEFT,1);
        animate(belowDivs[i],RIGHT,1);

}
/**
 * 
 * @param {HTMLElement} div 
 * @param {String} direction 
 * @param {integer} velocity 
 */
function animate(div,direction,velocity){
    let treasureArray =  div.querySelectorAll(".treasure"),
        tLength = treasureArray.length,
        boxWidth = div.querySelector(".treasure").offsetWidth,
        allBoxsWidth = boxWidth * (tLength - 6),
        inisialLeft;
        // console.log("tLength",tLength,"inisialLeft",inisialLeft,"allBoxsWidth",allBoxsWidth);
    if(direction == LEFT){
        inisialLeft = div.offsetLeft;
        console.log(inisialLeft);
        let tempIntervalId = setInterval(()=>{
            div.style.left = (div.offsetLeft - velocity) + 'px';
            // console.log("LEFT",div.style.left);
            if(div.offsetLeft < -1 * (allBoxsWidth)){
                div.style.left = inisialLeft + 'px';
            }
        },40);
        aboveIntervalId.push(tempIntervalId);
        
    }else if(direction == RIGHT){
        inisialLeft = -allBoxsWidth;
        console.log(inisialLeft);
        let tempIntervalId  = setInterval(()=>{
            div.style.left = (div.offsetLeft + velocity) + 'px';
            // console.log("RIGHT",div.style.left);
            if(div.offsetLeft  >= 0){
                div.style.left = inisialLeft  + 'px';
            }
        },40); 
        belowIntervalId.push(tempIntervalId);
    }
}