您好,登录后才能下订单哦!
本篇内容主要讲解“jquery如何用CSS()设置鼠标禁止样式”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“jquery如何用CSS()设置鼠标禁止样式”吧!
方法:只需用CSS()将鼠标样式属性“cursor”的值设置为“not-allowed”即可,语法为“元素对象.css("cursor","not-allowed")”或“元素.css({"cursor":"not-allowed"})”。
本教程操作环境:windows7系统、jquery1.10.2版本、Dell G3电脑。
想要设置鼠标禁止样式,只需用的cursor属性。
只需用CSS()将鼠标样式属性“cursor”的值设置为“not-allowed”即可。
设置语法有两种:
元素对象.css("cursor","not-allowed") 元素对象.css({"cursor":"not-allowed"})
实现示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("button").click(function() { // $("p").css("cursor","not-allowed"); $("p").css({"cursor":"not-allowed"}); }); }); </script> </head> <body> <p>一个p元素,让鼠标移动到该元素上</p> <button>设置鼠标禁止样式</button> </body> </html>
说明:
cursor属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状。
当cursor属性的属性值为“not-allowed”,则鼠标光标形状为禁止图案。
cursor属性取值如下,默认值为default
crosshair; | 十字准心 | 光标表现为十字准线 |
cursor: pointer; | 手 | 光标标以暗示(手指)的形式来表明有一个连接 |
cursor: wait; | 等待/沙漏 | 光标暗示当前程序正忙(一般为一块表或是一个沙漏) |
cursor: help; | 帮助 | 光标暗示当前位置可得到帮助(一般为问号或是气球) |
cursor: no-drop; | 无法释放 | cursor: no-drop; |
cursor: text; | 文字/编辑 | 光标暗示当前所处位置为文字内容 |
cursor: move; | 可移动对象 | 光标暗示一些东西应该被移动 |
cursor: n-resize; | 向上改变大小(North) | 边缘可向上移动(北) |
cursor: s-resize; | 向下改变大小(South) | 边缘可向下方移动(南) |
cursor: e-resize; | 向右改变大小(East) | box边缘可向右(东)边移动 |
cursor: w-resize; | 向左改变大小(West) | 边缘可向左移动(西) |
cursor: ne-resize; | 向上右改变大小(North East) | 光标暗示box的边缘可向右上方移动(东北方向) |
cursor: nw-resize; | 向上左改变大小(North West) | 边缘可向左上方移动(西北) |
cursor: se-resize; | 向下右改变大小(South East) | 边缘可向右下方移动(东南) |
cursor: sw-resize; | 向下左改变大小(South West) | 边缘可向左下方移动(西南) |
cursor: auto; | 自动 | 浏览器设置一个光标 |
cursor:not-allowed; | 禁止 | cursor:not-allowed; |
cursor: progress; | 处理中 | cursor: progress; |
cursor: default; | 系统默认 | 默认的光标状态(通常为一个箭头) |
cursor: url(' # '); | 用户自定义(可用动画) | 自定义光标的url位置 注意:在定义完自定义的光标之后在末尾加上一般性的光标,以防那些url所定义的光标不能使用 |
大家可能会说,cursor属性值这么多,怎么记呀?其实大家不用担心,在实际开发中,我们一般只用到“default”和“pointer”这两个属性值,其他的一般都很少用得上。如果实在没办法还需要其他的,那就回来查这种表就行了。
到此,相信大家对“jquery如何用CSS()设置鼠标禁止样式”有了更深的了解,不妨来实际操作一番吧!这里是亿速云网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。