javascript实现页面右侧在线客服始终跟随鼠标滚动而上下滚动且始终位于屏幕中间

效果如图，右侧的联系一栏始终位于页面的中间位置，且随着页面的上下滚动而滚动跟随

css的话没什么好说的，看图

代码

window.onload=window.onresize=window.onscroll=function(){
        var csFloor = document.getElementById("co_ser_floor");
        var iScrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        setTimeout(function() {
          clearInterval(csFloor.timer);
          var iTop = parseInt((document.documentElement.clientHeight - csFloor.offsetHeight) / 2) + iScrollTop ;
          csFloor.timer = setInterval(function() {
            var iSpeed = (iTop - csFloor.offsetTop) / 8;
            iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
            csFloor.offsetTop == iTop ? clearInterval(csFloor.timer) : (csFloor.style.top = csFloor.offsetTop + iSpeed + "px");
          },
          30)},100)
    }

1.获取目标元素

2.获取页面往下滚动时被卷去的距离，兼容性写法，document.documentElement.scrollTop || document.body.scrollTop，两者在一起时只能有一个产生作用

3.设置一个定时器，页面载入后100ms后去执行里面的内容。

4.首先需要关闭定时器, csFloor.timer的写法是给自身加了个timer属性，相当于定时器私有化了，这样写的好处是当事件发生太快时，不用争抢定时器了，尤其在多物体运动时

5.定义变量iTop表示(当前页面的显示高度-目标元素的高度)/2 + 页面滚动时滚去的高度，其实就是目标元素居中的起始top值

6.定义定时器，30ms执行一次

7.定义速度，后面除以的数值可以自定义，表示动画运行的速度

8.由于缓冲运动要取整，如果速度>0的话向上取整否则向下取整

9.如果目标元素的top值等于居中位置所在的top值则清除浮动，否则目标元素的高就等于自身在当前版面的offsetTop值+速度，这里速度可能就是负值了（向下滚动时）