aaaaa

a.js

let box1 = document.getElementById('box1');
let box2 = document.getElementById('box2');
let ypos1 = 0;
let ypos2 = 0;
let counter1 = 0;
let counter2 = 0;
let text0 = document.querySelector('#text0');
let input = document.querySelector('#input');
let reverse = false;

input.onkeyup = function (e) {
	text0.innerHTML = e.target.value;
	for (let i = 0; i < 1000; i++) {
		text0.innerHTML += i;
	}
};

function translateY1() {
	counter1++;
	let wLimit = window.innerHeight - box1.clientHeight - box2.offsetTop;
	ypos1 += 5;
	box1.style.transform = `translateY(${ypos1}px)`; // be right back
	if (ypos1 < wLimit) {
		requestAnimationFrame(translateY1);
	}
}

function translateY2() {
	counter2++;
	let wLimit = 500;
	box2.style.transform = `translateY(${ypos2}px)`;
	if (ypos2 >= wLimit) {
		reverse = true;
	} else {
		reverse = false;
	}
	setTimeout(translateY2);
}

function a() {
	alert('toto');
}

// translateY1();
// translateY2();