jquery,当把鼠标 移到某<div/>上时,把鼠标形状 换成自己的一个小图片。怎么做。

如题所述

鼠标样式这个东西挺绕的。我总结下我的经验。

首先不需要用jquery定义鼠标,css里面就有。
语法
cursor:url(你自己的路径),auto;
url里面是你自己的路径,auto实际上是后面需要跟的标准样式。
浏览器会先加载你设定路径的样式,如果没有则加载auto这里你自定义的。auto,default等等都可以。

语法很简单,但用起来不简单。
1、如果用图片(gif,png)等,不能超过32*32,否则浏览器不认识。
2、ie浏览器不认识gif,png等的图片。
3、鼠标样式文件一般是.cur .ani格式。IE都支持
4、firefox等标准浏览器不支持.ani格式。
5.firefox等标准浏览器好像也不支持动画效果的.cur文件。

CSS都支持,用jquery就多此一举了,我也写上:
$(document).ready(function(){
$(".bg").hover(
function(){$(this).css({cursor:"url(3dgnwse.cur),auto"})},
function(){$(this).css({cursor:"url(),auto"})
})
})
<div class="bg">3dgnwse.cur是你自己的文件路径</div>
总结,为了兼容各个浏览器,建议使用.cur格式鼠标文件。
你如果是gif等格式文件。上网下载制作.cur的小软件,可以制作.cur,很简单。

本人能力有限,如果有错误的地方还请其他人指出
温馨提示:内容为网友见解,仅供参考
第1个回答  2010-01-05
cursor:url("图片的路径");

鼠标放在超链接上, 显示DIV。 移开后隐藏DIV。
1、首先我们在html里定义一个div,id为‘mouse_div’,然后定义该div的样式,主要是定义position,让其绝对定位。2、然后通过JS脚本来做随鼠标移动的效果。先引入jquery脚本,因为用到jquery操作dom。3、最后添加代码,在页面加载完后,给页面添加鼠标mousemove事件,在事件函数里,调用 moving方法,就实现...

如何用CSS设置连接鼠标在上面是变成手型
一、打开前端开发软件,新建一个html代码页面。二、在新建的html代码页面上找到<body>,在这个<body>标签里创建一个标签,a案例中使用的是<a>。三、为新家<a>添加鼠标指针为手指样式。在html代码页面中找到<tilte>,在这个<title>后面创建一个<style>,然后在<style>中新建一个样式类,最后为这个样式...

...鼠标在显示的div上时就不隐藏,反之隐藏!(jquery 实现)谢了!!!_百...
\/\/鼠标离开图片时触发 function () { ("#div id").hover(\/\/鼠标在层上时,不改变 function () { },\/\/鼠标里开层时,隐藏层 function () { ("#div id").hide();});} );\/\/鼠标在离开图片后,仍在层上,之后离开层 ("#div id").hover(\/\/鼠标仍在div上,不改变 function () {...

JQUERY多个DIV鼠标移入移出显示隐藏对应DIV
(function(){\/\/鼠标移入$('.list').mouseenter(function(){\/\/这里使用mouseover也可以,使用mouseenter是防止冒泡(this).find('span').show();\/\/这里的show可以改成animate,toggle都可以});\/\/鼠标移出$('.list').mouseleave(function(){\/\/这里使用mouseover也可以,使用mouseenter是防止冒泡$(th...

HTML,当我鼠标移动到小图片上面的时候,鼠标后面就显示大图片?
下载一下jquery插件,然后新建一个ToolTip.js文件,在该文件下写入以下代码:(function() { var x = 10;var y = 10;("a.tooltip").mouseover(function(e) { this.myTitle = this.title;this.title = "";var tooltip = "<div id='tooltip'><img src='" + this.href + "' alt='...

JQuery 鼠标移到一个层上显示另一个层问题
第一个问题解决思路:每个一级菜单设置hover事件没有问题,但是你的代码中显示的二级菜单却成为了全局所有的了,所以需要修改为当前一级菜单下面的$(".subCategory")元素,即 $(一级菜单).find(".subCategory")--->>> 这样才会显示为当前一级菜单下的二级菜单。第二个问题解决思路:由于hover事件中...

javascript 隐藏鼠标。当鼠标经过一个div时,使鼠标不显示。怎么做?
很明确的告诉你。javascript是无法隐藏鼠标的 唯一可行的办法是通过CSS设置cursor为透明图片达到隐藏效果 但是设置图片的方法无法跨浏览器 IE和其他兼容浏览器实现方法不同

jquery 做一个 鼠标移动table上的tr的时候,在鼠标旁边弹出一个div提 ...
先定义一个DIV,把你要提示的内容,放到这个DIV中 <div id="divInfo" style="visibility:hidden;"> <p>向上增加一行<\/p><br\/> <p>修改此行<\/p><br\/> <p>向下增加一行<\/p> <\/div> 代码:("table tr").mouseover(function(){ ("#divInfo").css("z-index",999);\/\/让层浮动 ("...

CSS DIV 怎么做出来鼠标移动上就显示其内容?
1、新建html文档,在body标签中添加一个div标签,然后在div标签中添加p标签,为p标签添加内容:2、为了方便演示,给div标签设置宽高和背景颜色,然后给p标签设置“display”属性,属性值为“none”,这样p标签中的文字默认情况下不会显示:3、给div设置hover伪类,当鼠标移动到div区域时,设置p标签的样式...

js css 鼠标移入某个区域滑出一个框的效果怎么做?
实现原理:刚开始框就存在了,只不过透明度为全透明,鼠标移入后透明度不透明就显示出来了,框稍微动画一些的话就用到css3的旋转之类的了。如下图 <!doctype html><html><head><meta charset="utf-8"><title>css3练习<\/title><link href="my-1.css" rel="stylesheet" type="text\/css"><...

相似回答