首页 > 其他分享 >获取鼠标相对于浏览器窗口坐标

获取鼠标相对于浏览器窗口坐标

时间:2023-08-16 17:35:41浏览次数:39  
标签:浏览器 鼠标 let 坐标 10px div document

<!DOCTYPE html>
<html>
<head>
    <style>
        div {
            position: fixed;
            top: 10px;
            left: 10px;
            padding: 10px;
            background-color: #f1f1f1;
            border: 1px solid #ccc;
        }
    </style>
</head>
<body>
    <div></div>
    <script>
        const d = document.querySelector('div')
        document.addEventListener('mousemove', function (e) {
            let x = e.clientX
            let y = e.clientY
            d.innerHTML = `X: ${x}, Y: ${y}`

        })
    </script>
</body>

</html>

image

标签:浏览器,鼠标,let,坐标,10px,div,document
From: https://www.cnblogs.com/bangbangzoutianya/p/17635716.html

相关文章

  • 360浏览器上的对js支持的一些特别的问题
    在做web项目时候,基本测试了IE,火狐,chrome,基本就觉得差不多了。但是国内的用户,经常反而使用搜狗,360之类的伪浏览器,因为他们都稀里糊涂的被捆绑了。这里要说的是,在其他浏览器很兼容的东西,但是到360这边就出问题了。2个表格显示的例子。例1:jq('#classManageTable').append(data);这个......
  • pythonOCC 将二维坐标转化为三维坐标
    OCC当中提供了多种方式转换直接转换为三维坐标使用V3d_View.ProjReferenceAxe()会返回有6个元素的元组,前三位分别对应XYZ例子self._display.View.ProjReferenceAxe()但是,这种方式转换的坐标让人有点摸不着头脑,不推荐 通过求交点获取这种方式会把鼠标限制与某一个面上,......
  • 常用浏览器重要启动参数和配置参数整理
    IE的常用启动参数1、-nohome双击此快捷方式则只打开一个空白IE窗口,可以加快IE启动速度,同时如果IE主页被恶意修改了,利用此法就不会自动打开恶意主页。2、-k-k参数可以让IE工作在全屏方式下。3、-v-v参数会显示出IE当前的版本(Unix平台上适用)。Firefox的常用启动......
  • windows下各个浏览器用html5进行h.264大视频播放的性能对比说明
    最近在调查windows下哪种浏览器进行大视频播放时候稳定性比较高。举h.264的4g的视频为例。选用的浏览器有ie10,firefox,chrome。(因为opera不支持h.264所以没有考虑。safali在windows上的用户不是很多,也暂不考虑)先说明一下,机器的内存是2G。使用的都是最新版本的各个浏览器。采用的是h......
  • H265格式兼容各个浏览器web端播放方案
    可能有很多朋友会遇到H265格式的视频流无法播放,毕竟现在很多相机都支持h265了,确实有很多优点,但是它最大的问题就是很多浏览器无法播放,也有部分浏览器能够兼容h265,但是总不能让用户指定浏览器使用吧,下面来说说怎么兼容各个浏览器播放。无非两种方案,第一种就是使用ffmpeg进行转码,这种......
  • 浏览器中输入:“www.learnjava.com”之后都发生了什么?请详细阐述
    当在浏览器中输入"www.woaijava.com"并按下回车后,会依次发生以下步骤:域名解析:浏览器首先会将输入的域名"www.woaijava.com"解析为对应的IP地址。它会查询本地DNS缓存,如果找不到,则会向域名服务器发起请求。DNS查询:如果本地DNS缓存中没有对应的IP地址,浏览器会......
  • 网页安防视频流媒体播放器,实现在web浏览器播放H.265编码视频
    目前安防监控行业,基本所有的摄像头都支持H264编码,但是已经有部分摄像头开始支持H265,并且支持H265的摄像机已经越来越多。H265相比H264有着很多优势,压缩更高,网络传输消耗的带宽更小,相同码率下H265视频更清晰。H264目前已经可以在各种web浏览器、客户端等进行解码播放,但是目前H.265编......
  • Fabric区块链浏览器(1)
    本文是区块链浏览器系列的第三篇,本文介绍区块链浏览器的主体部分,即区块数据的解析。这一版本的区块链浏览器是基于gin实现的,只提供三种接口:/block/upload:POST,上传Protobuf格式的区块数据文件/block/parse/:msgType:GET,根据msgType来解析上传的区块文件/block/update/:channel:P......
  • 阻止谷歌浏览器记住密码功能
    有些时候写登录页面的时候会遇到这种问题,就是有input密码框的时候,输入完密码的时候浏览器会自动记住密码,再次打开页面时会自动填充上,如图原本登录框是这个样子:所以就不美观了,怎样解决这类问题呢?于是搜了半天这个问题,最后的解决方法是:1.在input输入框内加一个属性:autocomplete="new-......
  • Firefox浏览器怎么设置HTTP代理
    Firefox浏览器是广受欢迎的开源浏览器,提供了丰富而灵活的功能。通过设置HTTP代理,我们可以实现隐私保护、突破网络限制或加速网页加载速度。下面,让我们一步步了解如何在Firefox浏览器中设置HTTP代理,让网络浏览更加自由与安心。第一步:打开Firefox浏览器的设置页面首先,打开Firefox浏览......