鼠标样式和指向

学习抖音: @渡一前端教科频道

图上指针跟着鼠标移动,并且改变方向

 

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><style>* {padding: 0;margin: 0;}.arrow {position: fixed;width: 30px;height: 30px;margin-left: -15px;}.arrow img {width: 100%;height: 100%;display: block;}html {cursor: none;}</style>
</head><body><div class="arrow"><img src="./arrow.png" alt=""></div>
</body><script>let arrow = document.querySelector(".arrow")let rad = 0window.onmousemove = (e) => {if (Math.abs(e.movementX) + Math.abs(e.movementY) > 2) {// 计算角度 反正切  这里y是要去负数  因为 这里的Y轴方向是从上到下rad = Math.atan2(e.movementX, -e.movementY)}arrow.style.transform = `translate(${e.clientX}px, ${e.clientY}px) rotate(${rad}rad)`}
</script></html>

 

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/42118.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Spring Clould 消息队列 - RabbitMQ

视频地址&#xff1a;微服务&#xff08;SpringCloudRabbitMQDockerRedis搜索分布式&#xff09; 初识MQ-同步通讯的优缺点&#xff08;P61&#xff0c;P62&#xff09; 同步和异步通讯 微服务间通讯有同步和异步两种方式&#xff1a; 同步通讯&#xff1a;就像打电话&…

数据库名字添加中文

Jetbrains 可以呀&#xff0c;这个ui 相当棒 from database import Sqlite3Database from googletrans import Translator import csvif __name__ "__main__":TRANS_EN2ZH Falsetranslator Translator()sqlite Sqlite3Database("./drurmu.db")sqlite.r…

x.view(a,b)及x = x.view(x.size(0), -1) 的理解说明

x.view()就是对tensor进行reshape&#xff1a; 我们在创建一个网络的时候&#xff0c;会在Foward函数内看到view的使用。 首先这里是一个简单的网络&#xff0c;有卷积和全连接组成。它的foward函数如下&#xff1a; class NET(nn.Module):def __init__(self,batch_size):sup…

小米交卷大模型,全新小爱同学实测来了

本文源自&#xff1a;量子位 果然只有雷军和小米&#xff0c;能抢走风口上大模型的热度。 在雷军的年度演讲分享中&#xff0c;讲武大求学经历&#xff0c;分享学霸4年大学2年完课经验&#xff1b;讲被《硅谷之火》点燃&#xff0c;勤奋练习写最好的代码&#xff0c;开启第一…

armbian使用1panel快速部署部署springBoot项目后端

文章目录 前言环境准备实现步骤第一步&#xff1a;Armbian安装1panel第二步&#xff1a;安装数据库第三步&#xff1a;查看数据库容器重要信息【重要】查看容器所在的网络查看容器连接地址 第四步&#xff1a;项目配置和打包第五步:构建项目镜像 前言 这里只是简单记录部署spr…

一次性解决office部署问题(即点即用等)

前言 因为之前电脑安装了office2019&#xff0c;后面需要安装Visio&#xff0c;下载安装时报错30204-44,查看发现之前安装的office版本是即点即用版&#xff0c;可能这两者不兼容。网上搜索教程等&#xff0c;最后发现一个工具&#xff1a;Office Tool Plus&#xff0c;可以方便…

【水文学法总结】河道内生态流量计算方法(含MATLAB实现代码)

生态流量&#xff08;Ecological Flow, EF&#xff09; 是指维持河道内生态环境所需要的水流流量。生态流量计算方法众多&#xff0c;主要分为水文学方法、栖息地模拟法、水力学方法、整体法等&#xff0c;各方法多用于计算维持河道生态平衡的最小生态流量&#xff08;Minimum …

LeetCode 141.环形链表

文章目录 &#x1f4a1;题目分析&#x1f4a1;解题思路&#x1f514;接口源码&#x1f4a1;深度思考❓思考1❓思考2 题目链接&#x1f449; LeetCode 141.环形链表&#x1f448; &#x1f4a1;题目分析 给你一个链表的头节点 head &#xff0c;判断链表中是否有环。 如果链表中…

【ES6】—let 声明方式

一、不属于顶层对象window let 关键字声明的变量&#xff0c;不会挂载到window的属性 var a 5 console.log(a) console.log(window.a) // 5 // 5 // 变量a 被挂载到window属性上了 &#xff0c; a window.alet b 6 console.log(b) console.log(window.b) // 6 // undefin…

原生js获取今天、昨天、近7天的时间(年月日时分秒)

有的时候我们需要将今天,昨天,近7天的时间(年月日时分秒)作为参数传递给后端,如下图: 那怎么生成这些时间呢?如下代码里,在methods里的toDay方法、yesterDay方法、weekDay方法分别用于生成今天、昨天和近7天的时间: <template><div class="box"&…

暂停Windows更新的方法,可延后数十万年,简单且有手就行

前言 近年来&#xff0c;Windows更新频率过快&#xff0c;最大只能暂停更新5周&#xff0c;导致用户不厌其烦&#xff0c;从网上找到的暂停更新的方法不是过于繁琐就是毫无效果&#xff0c;或者是暂停的时间有限&#xff0c;无意中发现一个大神的帖子可以通过修改注册表信息以达…

Java定时任务方案

一、Timer import java.util.Timer; import java.util.TimerTask;public class TimerExample {public static void main(String[] args) {Timer timer new Timer();TimerTask task new TimerTask() {Overridepublic void run() {System.out.println("Task executed at:…

uni-app自定义多环境配置,动态修改appid

背景 在企业级项目开发中&#xff0c;一般都会分为开发、测试、预发布、生产等多个环境&#xff0c;在工程化中使用不同的打包命令改变环境变量解决不同环境各种变量需要手动修改的问题&#xff0c;比如接口请求地址&#xff0c;不同环境的请求路径前缀都是不同的。在使用uni-…

Docker中为RabbitMQ安装rabbitmq_delayed_message_exchange延迟队列插件

1、前言 rabbitmq_delayed_message_exchange是一款向RabbitMQ添加延迟消息传递&#xff08;或计划消息传递&#xff09;的插件。 插件下载地址&#xff1a;https://www.rabbitmq.com/community-plugins.html 1、下载插件 首先需要确定我们当前使用的RabbitMQ的版本&#xff0c…

Android隐藏输入法

1、方法一(如果输入法在窗口上已经显示&#xff0c;则隐藏&#xff0c;反之则显示) InputMethodManager imm (InputMethodManager) getSystemService(Context.INPUT_METHOD_SERVICE); imm.toggleSoftInput(0, InputMethodManager.HIDE_NOT_ALWAYS); 2、方法二(view为接受软…

实践教程|基于 pytorch 实现模型剪枝

PyTorch剪枝方法详解&#xff0c;附详细代码。 一&#xff0c;剪枝分类 1.1&#xff0c;非结构化剪枝 1.2&#xff0c;结构化剪枝 1.3&#xff0c;本地与全局修剪 二&#xff0c;PyTorch 的剪枝 2.1&#xff0c;pytorch 剪枝工作原理 2.2&#xff0c;局部剪枝 2.3&#…

前端如何安全的渲染HTML字符串?

在现代的Web 应用中&#xff0c;动态生成和渲染 HTML 字符串是很常见的需求。然而&#xff0c;不正确地渲染HTML字符串可能会导致安全漏洞&#xff0c;例如跨站脚本攻击&#xff08;XSS&#xff09;。为了确保应用的安全性&#xff0c;我们需要采取一些措施来在安全的环境下渲染…

QString常用函数介绍

此篇博客核心介绍QT中的QString类型的常用函数&#xff0c;介绍到的函数均从帮助手册或其他博客中看到 QString 字符串类 Header: #include qmake: QT core 一、QString字符串转换 1、QString类字符串转换为整数 int toInt(bool *ok Q_NULLPTR, int base 10) cons…

Python 基础 -- Tutorial(二)

5、数据结构 本章更详细地描述了一些你已经学过的东西&#xff0c;并添加了一些新的东西。 5.1. 更多关于Lists 列表(list)数据类型有更多的方法。下面是列表对象的所有方法: list.append(x) 在列表末尾添加一项。相当于a[len(a):] [x]。 list.extend(iterable) 通过添加可…