使用 JavaScript 更改鼠标指针

2024-01-26

我想使用 JavaScript 脚本来更改网站上的鼠标指针。 最好用 CSS 来完成,但我的要求是一个可以分发给很多人以嵌入到他们网站的头部部分的脚本。 通过 CSS,可以通过以下方式进行操作

html
{
    cursor: *cursorurl*
}

如何在 JavaScript 中做同样的事情?


JavaScript 非常擅长操作 CSS:

 document.body.style.cursor = *cursor-url*;
 //OR
 var elementToChange = document.getElementsByTagName("body")[0];
 elementToChange.style.cursor = "url('cursor url with protocol'), auto";

或者使用 jQuery:

$("html").css("cursor: url('cursor url with protocol'), auto");

Firefox 不管用除非您在成像光标后指定默认光标!

其他光标关键字 http://www.w3schools.com/CSSref/pr_class_cursor.asp

另请记住,IE6 仅支持.cur 和 .ani 游标 http://www.javascriptkit.com/dhtmltutors/csscursors.shtml.

如果光标没有变化:如果您相对于光标位置移动光标下的元素(例如元素拖动),则必须强制重绘该元素:

// in plain js
document.getElementById('parentOfElementToBeRedrawn').style.display = 'none';
document.getElementById('parentOfElementToBeRedrawn').style.display = 'block';
// in jquery
$('#parentOfElementToBeRedrawn').hide().show(0);

工作样本:

document.getElementsByTagName("body")[0].style.cursor = "url('http://wiki-devel.sugarlabs.org/images/e/e2/Arrow.cur'), auto";
div {
  height: 100px;
  width: 1000px;
  background-color: red;
}
<html xmlns="http://www.w3.org/1999/xhtml">

  <body>
    <div>
    hello with a fancy cursor!
    </div>
  </body>

</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JavaScript 更改鼠标指针 的相关文章

  • TinyMCE 输入以相反顺序写入

    我面临这个问题 每当我输入 TinyMCE 时 我的光标会自动向左移动 最终从右向左写入文本 它只发生在我部署的应用程序中 但如果我在我的机器上本地运行代码 同样可以正常工作 发生这种情况的任何可能原因 相同的屏幕截图 https i st
  • javascript switch/case :比较类型吗? [复制]

    这个问题在这里已经有答案了 可能的重复 在 Javascript switch 语句中进行严格比较是否安全 https stackoverflow com questions 6989902 is it safe to assume str
  • 如何使用nodeJS SFTP客户端列出所有子目录?

    有趣的节点 JS ssh2 sftp client 我想列出给定路径中的所有目录及其子目录 let sftp new ssh2SftpClient console log sftp sftp connect host xx xxx xxx
  • 全局 JavaScript 变量作用域:为什么这不起作用?

    所以我在玩 JavaScript 时遇到了我认为奇怪的事情 有谁能解释一下以下内容吗 我已将警报值作为评论包含在内 为什么 foo 中的第一个警报 msg 返回不明确的并不是outside var msg outside function
  • 使用 word_number 值对 javascript 数组进行排序

    如何对数组进行排序 var arr new Array word 12 word 59 word 17 这样我得到 word 12 word 17 word 59 Thanks 您需要编写一个排序方法 您可以编写任何您喜欢的方法 该方法在
  • IE8 中的 Javascript 消息超出堆栈空间

    我正在使用 Breeze 1 4 1 Internet Explorer 8 和 ASP NET MVC 4 Web API 我在查询时收到以下消息 查询失败 localhost port breeze Data Metadata 元数据导
  • 为什么 JSON.stringify() 接受 Date 对象?

    至少在 Firefox 中 您可以对 Date 对象进行字符串化 gt gt gt JSON stringify now new Date now 2012 04 23T18 44 05 600Z 这是有效的 因为 在 Firefox 中
  • React.js this.props.data.map() 不是一个函数

    我正在搞乱反应并尝试解析和渲染 json 对象 现在 我只是使用硬编码对象设置它以进行测试 而不是从 ajax 调用中获取它
  • 拖放图像上传在服务器上不起作用

    我正在尝试实现拖放图像上传 我在网上找到了一个相当简单的脚本并适合我的使用 在我的本地安装中 文件上传得很好 但在服务器上却不行 从我的调试尝试来看 SERVER HTTP X FILENAME 甚至没有被 php 设置 我尝试了以下方法
  • jQuery 问题:它的真正含义是什么?

    function window undefined jquery code jQuery window 它到底意味着什么 是不是也意味着 document ready 或者只是两种不同的东西 已经有两个答案 但这是我对代码缺失端的猜测 fu
  • 如何防止在达到一定字符数后向文本区域输入内容?

    使用下面的代码 任何超过指定最大值的输入都将被删除 但这会产生一种效果 即键入字符后立即将其删除 我宁愿简单地阻止输入字符
  • Javascript 访问 Disqus 评论文本框?

    我正在开发一个浏览器扩展 它应该允许我访问文本框中的评论 帖子 现在很多网站都使用 Disqus 作为评论方式 但在输入文本时我无法找到访问 Disqus 评论框的方法 Disqus API 也没有透露太多信息 有人知道访问它的方法吗 解决
  • 通过电子邮件发送在 HTML5 画布上创建的图像

    我有一个画布 用户可以通过交互来更改设计 现在 用户完成更改后 可以提交他的设计及其电子邮件 ID 但为了提交设计 我使用以下方法将画布转换为图像http www nihilogic dk labs canvas2image http ww
  • JQuery _renderItem 没有被调用

    我正在尝试使用 renderItem 函数创建自定义 ui menu item 元素 但经过可能尝试后 我什至无法调用该函数 自动完成功能正在工作 但就像 renderItem 函数不存在一样 这是我的脚本部分
  • 检测 JavaScript 中的焦点丢失

    我希望能够检测 JavaScript 中任意元素何时失去焦点 因此我可以构建一个类似于 jEdit 的内联编辑工具 我不能依赖 jQuery 来实现这个库 所以我需要一个本机方法来完成它 我查看了 onblur 这似乎是正确的事情 但 MD
  • 如何从普通 JavaScript 中的输入获取对象

    例如 我有 3 个输入
  • 如何让无限滚动发挥作用?

    我正在尝试让这个无限加载脚本在我的项目中工作 这是我的 HTML div div div class pagina div div class pagina div div class pagina div div class pagina
  • 是否可以从 webpack 中的文件名中删除特殊字符?

    长话短说 我的资产文件名中不能包含某些字符 例如连字符 我没有运气通过解析 webpack 文档来弄清楚是否可以使用正则表达式或类似的东西重命名文件 这样我就可以从我无法控制源文件名的 3rd 方包中删除任何连字符 我的超级天真的例子是这样
  • Javascript/DOM:如何删除 DOM 对象的所有事件侦听器?

    只是问题 有没有办法完全删除对象的所有事件 例如一个div 编辑 我添加每div addEventListener click eventReturner false 一个事件 function eventReturner return f
  • 如何制作饼图聚合数据源?

    Using 适用于 ASP NET MVC 的 Kendo UI 完整版 http www kendoui com 版本 2013 3 1119 2013年11月20日 如果我有这段代码 status chart kendoChart da

随机推荐

  • 如何通过拦截器向AngularJS中的http请求添加新的标头?

    var module angular module timestamp marker example module factory timestampMarker function var timestampMarker request f
  • Web 服务与 DLL;优点和缺点?

    我正在为我们的网站实施一项网络服务 该服务通过互联网请求并接收来自第三方的数据 我还被要求创建一个 DLL 为内部 Windows 应用程序复制 Web 服务的功能 我的问题是 不创建 DLL 并使用 WEB 服务用于内部和 Web 应用程
  • 在 post_save 信号中访问用户的请求

    我在我的项目中完成了以下 post save 信号 from django db models signals import post save from django contrib auth models import User COR
  • 如何使 UILabel 中的文本缩小字体大小

    如果 UILabel 包含太多文本 如何设置标签以缩小字体大小 这是我设置 UILabel 的方法 descriptionLabel UILabel alloc initWithFrame CGRectMake 200 30 130 150
  • 接口变量是否具有值类型或引用类型语义?

    接口变量是否具有值类型或引用类型语义 接口由类型实现 这些类型要么是值类型 要么是引用类型 显然 两者int and string实施IComparable and int是一个值类型 并且string是一个引用类型 但是这个呢 IComp
  • 如何使用 javascript 更新 parse.com 中的当前对象?

    我想用 javascript 更新 parse com 中已有的对象 我所做的是我首先通过查询退休了该对象 但我不知道如何更新它 这是我使用的代码 有什么问题吗 var GameScore Parse Object extend Drive
  • 通过 Jenkins REST API 获取 IP 地址?

    我的任务是对 Jenkins 的一些工作进行一些健康检查 这个想法是通过 Jenkins Rest API 获取作业的状态和关联的 IP 地址 这样我就可以使用该信息与另一个 Restful API 进行交互 我创建了一个 groovy 脚
  • 如何禁用所有打字稿类型检查?

    我想使用 TypeScript将来 但目前 我选择在 Create React App 中安装 TypeScript 稍后我会回去添加类型 因此 我想禁用所有类型检查 现在 当我做这样的事情时
  • 定时器 C#.开始、停止和获取调用之间的时间量[重复]

    这个问题在这里已经有答案了 可能的重复 如何测量函数运行了多长时间 https stackoverflow com questions 10107140 how to measure how long is a function runni
  • 使用枚举实现单例(Java 中)

    我读到可以实施Singleton在Java中使用Enum例如 public enum MySingleton INSTANCE 但是 上面的方法是如何工作的呢 具体来说 一个Object必须被实例化 这里 怎么样MySingleton被实例
  • ServerSocket - 真的有必要 close() 它吗?

    我有这个该死的结构 public void run try if portField getText equals String p portField getText CharSequence numbers 0123456789 btn
  • nexttick 和 onupdated 有什么区别?

    我正在关注某人的教程来学习如何nexttick有效 但我无法理解它和onUpdated 如下所示 引用部分几乎会出于相同的原因出现或被调用 为了进一步理解它 我创建了下面发布的代码 并如图所示nexttick之后被调用onUpdated 你
  • 使用 NodeJS 在 MySQL 中运行 SQL 文件

    我正在使用mysql https github com felixge node mysqlNodejs 的插件 它非常适合做我到目前为止需要的一切 然而我遇到了一个绊脚石 我创建了一个导出 mysql 池的 MySQL 提供程序 var
  • JVM 与大型内存对象相关的问题

    我有一个二进制文件 其中包含一个短字符串列表 该列表在启动时加载并作为从字符串到 protobuf 包含字符串 的映射存储在内存中 不理想 但由于遗留问题很难改变设计 最近 该列表已从约 2M 条目增长到约 20M 条目 导致构建地图时失败
  • 如何使资源重定向到rails中的另一个控制器

    我有两个模型 Book and Magazine 属性方面几乎没有差异 但我希望它们共享相同的控制器和视图 Book 模型的控制器和视图 我的问题是 考虑到 Book 已经设置如下 在 paths rb 中设置 Magazine 模型的路线
  • Xerces-C 中的 XPath 支持

    我支持使用 Xerces C 进行 XML 解析的旧版 C 应用程序 我已经被 Net 宠坏了 并且习惯使用 XPath 从 DOM 树中选择节点 有什么方法可以访问 Xerces C 中一些有限的 XPath 功能吗 我正在寻找类似 se
  • 快速调整图片大小工具/脚本

    我在服务器上的一个文件夹中按日期组织了很多图像 500 000 我制作了一个 PHP 脚本来复制和裁剪子文件夹 拇指 上的每个 JPG 文件 但由于 PHP 不支持多线程 因此速度非常慢 我需要有关如何进行的建议 Python 是一个不错的
  • Paypal 按钮 + IPN(传递付款人用户名)

    有没有办法也传递和接收自定义变量 例如付款人的用户名 我不能强迫我的用户使用与他们在我的网站上使用的相同的贝宝电子邮件地址 最初由贝宝返回 传递额外的用户名将有助于轻松检查付款人的身份 您可以在发布到 PayPal 的表单中包含自定义隐藏字
  • PostgreSQL:外键列中的 NULL 值

    在我的 PostgreSQL 数据库中 我有下表 简化 CREATE TABLE quotations receipt id bigint NOT NULL PRIMARY KEY CREATE TABLE order confirmati
  • 使用 JavaScript 更改鼠标指针

    我想使用 JavaScript 脚本来更改网站上的鼠标指针 最好用 CSS 来完成 但我的要求是一个可以分发给很多人以嵌入到他们网站的头部部分的脚本 通过 CSS 可以通过以下方式进行操作 html cursor cursorurl 如何在