EarthQuake......
制作、维护[ 八目妖 & Small Small ]
技术细节
原版地震效果通过直移动窗口位置来实现地震效果。现代浏览器不可能让JavaScript直接移动窗口位置。
重制版重新定义了一个异步函数 quake(n) ,该函数接受一个参数 n 。
函数内部使用两个嵌套的循环,外层循环从 10 到 1,内层循环从 n 到 1。每次循环都会执行一系列的操作。
在每次循环中,会依次调用 make_transform 函数,并传入不同的参数。然后使用 sleep(100) 进行延迟,等待 100 毫秒。
make_transform 函数接受两个参数 x, y,会让id为quake_container的元素添加transform属性,值为translate([变量x]px, [变量y]px),继而实现地震效果。