用JS控制图片随鼠标移动
2016-03-15 19:25
603 查看
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> <style type="text/css"> img { position:fixed; } </style> <script type="text/javascript"> var picture; window.onload=function() { picture = document.getElementById("picture1"); window.onmousemove = onMove; } function onMove(event) { var x = event.clientX; var y = event.clientY; picture.style.top = y + "px"; picture.style.left = x + "px"; } </script> </head> <body> <img src="Img/1330721580922.gif" id="picture1" /> </body> </html>
里面主要用到的样式是position:fixed;和事件参数对象
浏览器在调用事件方法时,会创建一个事件参数对象,并将其传入到事件方法中
例如:
相关文章推荐
- js 数组定义与常用函数小结
- JavaScript系列:模块化与链式编程
- SWFUpload 和Extjs3.3 + swfUpload2.2 实现多文件上传组件
- JavaScript系列:函数调用方式
- js验证表单
- JS技巧
- js如何从循环跳出方法
- Extjs 打包 failed to find any files
- Jsoup 文档
- JS实现星级评分
- IE8-下trim()函数不可用的问题解决
- jstorm操作命令
- JStorm之Supervisor简介
- JStorm介绍
- JavaScript事件绑定与删除
- javascript之typeof、constructor、instanceof
- JavaScript-4.1-简单的表单操作,函数用法---ShinePans
- jsp:include,引入UTF-8编码的页面,会出现空白行的解决方法
- 新手引导插件intro.js的使用示例
- javascript笔记