鼠标移动小球 Java_js实现跟随鼠标移动的小球

本文实例为大家分享了js实现跟随鼠标移动的具体代码，供大家参考，具体内容如下

follow mouse

*{

margin: 0;

padding:0;

}

#div1{width: 50px;height: 50px;background: red;color:#fff;text-align: center;line-height: 50px; position: absolute;transition: all 0.5s; }

#div2{width: 50px;height: 50px;background: green;color:#fff;text-align: center;line-height: 50px;position:

absolute;transition: all 0.5s; }

.box1{

width: 400px;

height: 400px;

border: 1px solid #ccc;

}

.box2{

width: 400px;

height: 400px;

border: 1px solid #ccc;

}

1

2

function b1(ev) {

var oEvent = ev || event;

var oDiv = document.getElementById('div1');

if( oEvent.clientX<350&&oEvent.clientY<350){

oDiv.style.left = oEvent.clientX + 'px';

oDiv.style.top = oEvent.clientY + 'px';

}

}

function b2(ev){

var oEvent=ev||event;

var oDiv=document.getElementById('div2');

if( oEvent.clientX<350&&oEvent.clientY<750){

oDiv.style.left=oEvent.clientX+'px';

oDiv.style.top=oEvent.clientY+'px';

}

}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。