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),继而实现地震效果。