效果：
前置知识：CSS position，js map函数
实现原理：
视觉原理：远处的物体移动慢，近处的物体移动快
实现原理：在鼠标移动的时候，在原 div 的原有位置上+鼠标移动的距离和z-index的乘积
*Q:为什么要乘z-index?
A:在初始div的时候要给每个都设置z-index，越大（离你越近）的物体z-index越高or大*
步骤：
①获取每个div
②获取每个div当前的left和top
③鼠标移动时给每个元素加上鼠标移动距离*z-index；
代码实现：
HTML代码：
<div style="width:50px;height:50px;left:210px;top:50px;position: absolute;z-index: 1;background: blueviolet"></div><div style="width:100px;height:100px;left:50px;top:130px;position: absolute;z-index: 2;background: rgb(223, 66, 139)"></div><div style="width:150px;height:150px;left:300px;top:150px;position: absolute;z-index: 3;background: rgb(65, 163, 139)"></div><div style="width:200px;height:200px;left:50px;top:400px;position: absolute;z-index: 4;background: rgb(226, 197, 35)"></div>①获取每个div：
let aDiv=document.getElementsByTagName('div');②获取每个div当前的left和top：
let oldPos=Array.from(aDiv).map(div=>{ return { left:div.offsetLeft, top:div.offsetTop } });③鼠标移动时给每个元素加上鼠标移动距离*z-index；
document.onmousemove=function(ev){ let event=ev||window.event; Array.from(aDiv).forEach((div,index)=>{ div.style.left=oldPos[index].left+event.clientX*div.style.zIndex/100+'px'; //除100是为了div移动的不要太快 div.style.top=oldPos[index].top+event.clientY*div.style.zIndex/100+'px';//同理 }) }完整代码：
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script> window.onload=function(){ let aDiv=document.getElementsByTagName('div'); let oldPos=Array.from(aDiv).map(div=>{ return { left:div.offsetLeft, top:div.offsetTop } }); document.onmousemove=function(ev){ let event=ev||window.event; Array.from(aDiv).forEach((div,index)=>{ div.style.left=oldPos[index].left+event.clientX*div.style.zIndex/100+'px'; div.style.top=oldPos[index].top+event.clientY*div.style.zIndex/100+'px'; }) } } </script></head><body> <div style="width:50px;height:50px;left:210px;top:50px;position: absolute;z-index: 1;background: blueviolet"></div> <div style="width:100px;height:100px;left:50px;top:130px;position: absolute;z-index: 2;background: rgb(223, 66, 139)"></div> <div style="width:150px;height:150px;left:300px;top:150px;position: absolute;z-index: 3;background: rgb(65, 163, 139)"></div> <div style="width:200px;height:200px;left:50px;top:400px;position: absolute;z-index: 4;background: rgb(226, 197, 35)"></div></body></html>