1.首先分析一下，两侧广告跟随，就是在鼠标向下滚动时，左右两幅图也跟着向下滚动相等的距离
2.可以知道假设鼠标向下滚动了100px的话，那么两个图片也是向下滚动了100px，他的位置就是100加上图片距离父标签的距离
3.现在还要实现一个图片的缓慢移动，就是设置一个计时器，分步骤将图片一步一步的走到最终的位置
4.用当前屏幕被卷去的长度在加上距离上屏幕的高度就是图片应该到达的位置y，此时用y减去当前图片距离顶部的距离，就是图片到达y的距离sum。
5.要实现缓慢移动的话可以将sum/10,图片一点一点的移动就实现了缓慢移动
コードは以下のように表示されます
<body>
<div class="head_p"></div>
<div class="main_1"></div>
<div class="main_2"></div>
<div class="left_p"></div>
<div class="right_p"></div>
<script>
var y = 0;
var l = document.querySelector('.left_p');
var r = document.querySelector('.right_p');
window.onscroll = function () {
var y = window.pageYOffset;
animate(l, y + 100);
animate(r, y + 100);
}
function animate(ele, target) {
clearInterval(ele.timer);
ele.timer = setInterval(function () {
var step = (target - ele.offsetTop) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
ele.style.top = ele.offsetTop + step + "px";
console.log(step);
if (Math.abs(target - ele.offsetTop) < Math.abs(step)) {
ele.style.top = target + "px";
clearInterval(ele.timer);
}
}, 10);
}
</script>
</body>