简单的鼠标跟随

简单的鼠标跟随

当鼠标在这个页面上移动时会有一个可爱的小鼹鼠跟着你的鼠标跑来跑去，很有趣，那这种效果是如何实现的呢？ 　　我们先把源码粘贴框中的javascript代码加入到Html的<body>标签内：

<script language="javascript" type="text/javascript">
function mousemoving(e)
{
 if(document.layers)
 {
status="x:"+document.floatDiv.left+" y:"+document.floatDiv.top
document.floatDiv.x=e.pageX
document.floatDiv.y=e.pageY
 }
 if(document.all)
 {
    floatDiv.style.left=event.x+document.body.scrollLeft
    floatDiv.style.top=event.y+document.body.scrollTop
 }

document.onmousemove=mousemoving
if(document.layers)
{
  document.captureEvents(Event.MOUSEMOVE)
}</script>

---

　　然后选择一幅图片，假设图片的路径是“img\haha.gif”,然后加入一个层，并把它的ID改为“floatDiv”(与上面代码中的层的ID保持一致)，把图片放置到层中即可。我们也可以直接在Html的<body>之间插入如下的代码，这跟上面操作的效果是一样的。

---

<div id="floatDiv" style="position:absolute;"><img src="img/haha.gif" width="53" height="74"></div>

---

好了，现在浏览一下网页，看看效果吧。

♡ 点赞 0

☆ 收藏 0

留言区（共0条）