本文通过一个例子讲述了几个彩球跟随鼠标移动的动画效果，由原生JS实现。分享给大家参考，如下：

实现方法：

每个球都有自己的坐标。当球移动时，需要转移坐标，将第一个坐标依次转移到最后一个坐标，从而达到球随其移动的效果

实现代码：

！doctype HTML HTML Head metachartset=' UTF-8 ' Title Ball Sports/Title Style Type=' text/CSS ' p {边框-半径： 50%；宽度： 30px；height: 30px绝对位置：文本对齐：中心；线高： 30px；color:白色；}/style/head body/body script type=' text/JavaScript '//创建一个数组来存储所有球var balls=[]；//创建一个小球函数函数create balls(){ for(var I=0；i 60I){ var ball=document . create element(' p ')；ball . innerhtml=I 1；ball . style . background color=random color()；//将创建的球存储在array document.body.appendChild(球)中；//将数组中的所有球存储起来balls.push(球)；} } create balls()；//随机函数函数random num (m，n) {return math。地板(数学。random()*(n-m ^ 1)m)；}//random color函数random color(){ return ' RGB(' random num (0，255)'，' random num (0，255)'，' random num(0，255)')'；} document . onmousemove=function(e){ var event obj=e | | event；for(var I=balls . length-1；I 0；I-){//通过for循环球传递球的下标[I]。风格。左=球[I-1]。风格。向左；balls[I]. style . top=balls[I-1]. style . top；}//将第一个球分配给坐标球[0]。风格。left=eventobj。最新事件对象中的client x“px ”;balls[0]. style . top=EventObj . Clienty ' px '；}/脚本/html运行效果：

更多对JavaScript相关内容感兴趣的读者可以查看本网站专题：《JavaScript运动效果与技巧汇总》、《JavaScript动画特效与技巧汇总》、《JavaScript图形绘制技巧总结》、《JavaScript切换特效与技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript数学运算用法总结》和0103010

希望本文对JavaScript编程有所帮助。