将div的运动链接到另一个div的运动

Question

我正在制作一个酒精模拟器，所以当我按下一个按钮时，你会看到一个酒精瓶被排空，但同时我应该看到胃充盈。我已经有一个已经用于饮用的代码，但我想解决这个问题，如果瓶子的水移动了两步，那么胃的水只会移动一步。我只把js放在这里，如果你也想要html，请告诉我。

var top_max = 475,
top_min = 400,
left_max = 200;

function move_img(str) {
    var step = 1; // change this to different step value
    var el = document.getElementById('i1');
    var el2 = document.getElementById('i2');

if (str == 'up' || str == 'down') {
    var top = el.offsetTop;
    var height = el.offsetHeight;
    console.log(height);
    if (str == 'up') {
        top -= step;
        height += step;
    } else {
        top += step;
        height -=step;
    }
    if (top_max >= top && top >= 110) {
        document.getElementById('i1').style.top = top + "px";
        document.getElementById('i1').style.height = height;
    } else {
        clearInterval(myVar)
    }
} else if (str == 'left' || str == 'right') {
    var left = el.offsetLeft;
    if (str == 'left') {
        left += step;
    } else {
        left -= step;
    }
    if (top_left < left && left >= 0) {
        document.getElementById('i1').style.left = top + "px";
    } else {
        clearInterval(myVar)
    }
}



}


function auto(str) {
    myVar = setInterval(function () {
        move_img(str);
    }, 90);
}

function nana() {}

var myVar;

function handler() {
    clearInterval(myVar);
    auto(this.id);
}



function auto(str) {

 myVar = setInterval(function(){ move_img(str); }, 2)  ;



}


function stop(){

setTimeout(function( ) { clearInterval( myVar ); }, 1);


}