js图片跟随鼠标移动代码
火狐兼容性不太好
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html id="Main">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>类似QQ等级</title>
</head>
<body >
<img src="images/113.gif" id="Img"/>
<style>
#Img{ position:absolute; top:0px; right:0px;}
/*#Main{ background-color:#F60; width:px; height:px;}*/
</style>
<script>
window.onload=Main;
//全局坐标变量
var x="";
var y="";
//定位图片位置
function GetMouse(oEvent)
{
x=window.event.clientX;
y=oEvent.clientY;
document.getElementById("Img").style.left=(parseInt(x)+10)+"px";
document.getElementById("Img").style.top=y+"px";
}
//入口
function Main()
{
var ele=document.getElementById("Main");
//注册鼠标移动事件
ele.onmousemove=function(){GetMouse(event);}
// 注册鼠标按下事件
ele.onmousedown=function(){ChangeBg("Img","images/113.gif");}
//注册鼠标弹回事件
ele.onmouseup=function(){ChangeBg("Img","images/115.gif");}
}
//图片变化
function ChangeBg(id,url)
{
document.getElementById(id).src=url;
}
</script>
</body>
</html>