原来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 ...
随机推荐
- css旋转
翻转180度 /* entire container, keeps perspective */ .flip-container { perspective: 1000; } /* flip the ...
- Contributing to the C++ Core Guidelines
Contributing to the C++ Core Guidelines "Within C++ is a smaller, simpler, safer language strug ...
- NDK开发-零散知识点整理
JavaVM 标准Java平台下,每一个Process可以产生很多JavaVM对象,但在Android平台上,每一个Process只能产生一个Dalvik VM对象,也就是说在Android进程中是通 ...
- 利用spring boot创建java app
利用spring boot创建java app 背景 在使用spring框架开发的过程中,随着功能以及业务逻辑的日益复杂,应用伴随着大量的XML配置和复杂的bean依赖关系,特别是在使用mvc的时候各 ...
- WebSQL 查询工具
最近在写 WebSQL ,每次都在浏览器控制台执行 SQL 太费劲了,并且脑子不好使,总是忘记上次初始化的数据库是什么,所以写了一个特别简单的 WebSQL 可视化工具,说工具有点大了,就是为了方便, ...
- [转载] linux 下查看机器cpu是几核的
linux 下查看机器cpu是几核的 本文转自”映月的博客“:http://wurhuangfeng.blog.163.com/blog/static/35178241201111235829116/ ...
- SSAS中事实表中的数据如果因为一对多或多对多关系复制了多份,在维度上聚合的时候还是只算一份
SSAS事实表中的数据,有时候会因为一对多或多对多关系发生复制变成多份,如下图所示: 图1 我们可以从上面图片中看到,在这个例子中,有三个事实表Fact_People_Money(此表用字段Money ...
- android 使用jdbc1.3.0 操作 sql server
String connectDB = "jdbc:jtds:sqlserver://172.16.1.15:1433;DatabaseName=YanBu";// 连接字符串换成这 ...
- js 中关键字 this的用法
<1> js中this 的用法? (key:函数是由调用的,四种情况标红可知) (http://www.ruanyifeng.com/blog/2010/04/using_this_k ...
- Linux中环境变量文件及配置
Linux中环境变量文件及配置 一.环境变量文件介绍 转自:http://blog.csdn.net/cscmaker/article/details/7261921 Linux中环境变量包括系统 ...