Js中实现图片随鼠标移动——ClientX,ClientY,Position

简介:
 

<head>
    <script type="text/javascript">

        // 当监听事件受到body范围大小的限制的时候,那么就在document中监听
        document.onmousemove = function () {
           
           //获得鼠标的坐标值
           var x = window.event.clientX;
           var y = window.event.clientY;
            var divfly = document.getElementById("divFly");
            divfly.style.left = x;
            divfly.style.top = y;
        }
    </script>
</head>
<body>
    <div id="divFly" style="position:absolute">
        <img src="../images/b6.gif" alt="PositionDemo" />
    </div>
</body>

目录
相关文章
|
2月前
|
JavaScript 前端开发 安全
使用 Node.js 插件给指定目录下的所有图片添加上文字水印
使用 Node.js 插件给指定目录下的所有图片添加上文字水印
57 0
|
3月前
|
移动开发 JavaScript 定位技术
分享118个JS图片代码,总有一款适合您
分享118个JS图片代码,总有一款适合您
22 0
|
1月前
|
JavaScript 前端开发 API
js截取图片地址后面的参数和在路径中截取文件名或后缀名
在处理网页上的图片资源或者其他类型的文件资源时,你可能会遇到需要使用这些技巧的情况。以下是一些具体的使用场景:
17 0
|
1月前
|
JavaScript
js判断图片是否加载完成
js判断图片是否加载完成
24 0
|
1月前
|
Web App开发 前端开发 iOS开发
编程笔记 html5&css&js 008 HTML图片
编程笔记 html5&css&js 008 HTML图片
|
2月前
|
开发框架 JavaScript 小程序
uniapp、vue、小程序、js图片转base64 示例代码
uniapp、vue、小程序、js图片转base64 示例代码
|
3月前
|
JavaScript 前端开发 安全
分享117个JS图片代码,总有一款适合您
分享117个JS图片代码,总有一款适合您
13 0
|
Web App开发 JavaScript 前端开发
|
2月前
|
JavaScript
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
Node.js【GET/POST请求、http模块、路由、创建客户端、作为中间层、文件系统模块】(二)-全面详解(学习总结---从入门到深化)
27 0
|
2月前
|
消息中间件 Web App开发 JavaScript
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
Node.js【简介、安装、运行 Node.js 脚本、事件循环、ES6 作业队列、Buffer(缓冲区)、Stream(流)】(一)-全面详解(学习总结---从入门到深化)
72 0