View Code
<!
DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
>
< html >
< head >
< title > 跟随鼠标的图片特效 </ title >
< script language ="javascript" type ="text/javascript" >
document.onmousemove = function () {
var x = window.event.clientX;
var y = window.event.clientY;
var divId = document.getElementById( " divId " );
if ( ! divId) {
return ;
}
divId.style.left = x;
divId.style.top = y;
}
</ script >
</ head >
< body >
< div id ="divId" style ="position: absolute; margin-left:20px;" >
这里放的是图片
</ div >
</ body >
</ html >
< html >
< head >
< title > 跟随鼠标的图片特效 </ title >
< script language ="javascript" type ="text/javascript" >
document.onmousemove = function () {
var x = window.event.clientX;
var y = window.event.clientY;
var divId = document.getElementById( " divId " );
if ( ! divId) {
return ;
}
divId.style.left = x;
divId.style.top = y;
}
</ script >
</ head >
< body >
< div id ="divId" style ="position: absolute; margin-left:20px;" >
这里放的是图片
</ div >
</ body >
</ html >
其实这段代码很简单，也很好理解，只是获取了当前鼠标在屏幕中的位置； 然后再把坐标值赋给图片，或者文字!当然要用到 position:absoluute; 绝对定位！
