原来cursor:可以这样改变鼠标样式
前言:今天看百度的一个layui前端框架的时候,看到一个禁用图标的样式,鼠标移上去会变成一个自定义的图片样式,就在想难道cursor也可以自定义图片路径?!之前一直没有使用过。

使用了一下之后,遇到很多问题,比如图片的格式,后缀名以及大小等问题,然后查了一下相关资料。
语法:cursor:url(路径),auto;
auto是需要跟的标准样式,浏览器会先加载你设定好的路径,如果没有,则加载auto里自定义的,auto,default等都可以。
关于图片的格式:
1,如果用图片(gif,png)等,不能超过32*32,否则浏览器不认识
2,IE浏览器不认识gif,png等的图片格式
3,firefox等标准浏览器不支持.ani格式。
4.firefox等标准浏览器好像也不支持动画效果的.cur文件。
5、鼠标样式文件一般是.cur .ani格式。IE都支持
当然用jquery也可以实现:
$(document).ready(function(){
$('mouse').hover(
function(){$this.css({cursor:"url(cvte.cur),auto"})},
function(){$this.css({cursor:"url(),auto"})})
})
<div class="mouse"></div>
原来cursor:可以这样改变鼠标样式的更多相关文章
- 【问题】js 改变鼠标样式,chrome浏览器不能立即更新,暂没有解决办法
元素的css,cursor可以改变鼠标样式.也就是鼠标放到元素上去时,改变为相应状态. 通过JS改变cursor时,我发现chrome浏览器不能立即更新,需要动一下鼠标才行,试了几个其它浏览器都是立即 ...
- unity 改变鼠标样式的两种方法
1.第一个直接改变鼠标样式 public var cursorTexture:Texture2D; private var changeFlag = false; function Update(){ ...
- Unity编辑器 - 鼠标悬停在控件上时改变鼠标样式
Unity编辑器 - 鼠标悬停在控件上时改变鼠标样式 摘自Unity文档 EditorGUIUtility.AddCursorRect public static void AddCursorRect ...
- JS 改变鼠标样式
此片记录如何改变鼠标样式: document.body.style.cursor = "url(resource/pic/icons/magnifier3.cur) 12 12,crossh ...
- C\C++改变鼠标样式
改变鼠标样式可以使用SetClassLong函数 HCURSOR hcur = LoadCursor(NULL, IDC_CROSS); //加载系统自带鼠标样式 HWND hwnd = GetHWn ...
- Unity发布WebGL改变鼠标样式
记录:前段时间遇到一个需求,就是打包出来要在某种情况下鼠标的样子要改变成想要的样式. 详细代码如下 public Texture2D[] hand;//小指图标 /// <summary> ...
- Web前端:改变鼠标样式
<span style="cursor:auto">浏览器设置的光标</span><br /> <span style="cur ...
- 【HTML】改变鼠标样式图片css
你需要一张图 .ico 的 格式 如果一开始你要解决的是怎么去用png 格式图片转成 ICO格式 先做一张32*32的PNG格式图片 然后 打开http://www.easyicon.net/co ...
- C#开发分享:如何改变系统鼠标样式
开发过程中发现需要用到改变鼠标样式(就是光标的样子),但是在网上找了很多资料,都是介绍在程序中使用,我需要的效果时在系统级使用.现在找到了,分享给大家. [DllImport("user32 ...
随机推荐
- ARM 开发工具 Keil和DS-5的比较。
http://www.eeboard.com/bbs/thread-25219-1-1.html 如今ARM体系架构的处理器在嵌入式市场上呼风唤雨,从低端的MCU应用到高端的多媒体消费电子,移动设备领 ...
- 通过Chrome浏览器检测和优化页面
1.访问(http://www.cnblogs.com/viaiu/) 2.点击F12 前两步就在扯淡 3.点击Audits标签,进入测试界面 4.点击按钮开始检测 5.如下图可以进行页面加载资源的详 ...
- css3(border-radius)边框圆角详解
传统的圆角生成方案,必须使用多张图片作为背景图案.CSS3的出现,使得我们再也不必浪费时间去制作这些图片了,只需要border-radius属性,支持浏览器IE 9.Opera 10.5.Safari ...
- The prefix "util" for element "util:list" is not bound.
http://www.springframework.org/schema/util http://www.springframework.org/schema/util/spring-util-4. ...
- oracle 11g 服务启动时提示1053错误,服务启动不了,重新配置监听解决问题
早上发现oracle服务启动不了了,找了很多资料,没找到有用的.通过重新配置监听解决问题.
- SQLServer数据库监控代码
SQLServer数据库监控代码: creation_time, total_worker_time, last_worker_time, max_worker_time, min_worker_ti ...
- 目标检测方法——SSD
SSD论文阅读(Wei Liu--[ECCV2016]SSD Single Shot MultiBox Detector) 目录 作者及相关链接 文章的选择原因 方法概括 方法细节 相关背景补充 实验 ...
- GitHub上整理的一些工具
技术站点 Hacker News:非常棒的针对编程的链接聚合网站 Programming reddit:同上 MSDN:微软相关的官方技术集中地,主要是文档类 infoq:企业级应用,关注软件开发领域 ...
- YbSoftwareFactory 代码生成插件【二十】:DynamicObject的序列化
DynamicObject 是 .NET 4.0以来才支持的一个类,但该类在.NET 4.0下未被标记为[Serializable] Attribute,而在.NET 4.5下则被标记了[Serial ...
- Lucene热词统计
1.建立搜索表 ID KeyWords DT 搜索一次保存一次,id才用guid提高效率 /// <summary> /// 搜索数据 /// </summary> /// & ...