Home > Article > Web Front-end > How to use CSS() to set the mouse prohibition style in jquery
Method: Just use CSS() to set the value of the mouse style attribute "cursor" to "not-allowed". The syntax is "element object.css("cursor","not-allowed" )" or "element.css({"cursor":"not-allowed"})".
The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.
If you want to set the mouse prohibition style, just use the cursor attribute.
Just use CSS() to set the value of the mouse style attribute "cursor" to "not-allowed".
There are two setting syntaxes:
元素对象.css("cursor","not-allowed")
元素对象.css({"cursor":"not-allowed"})Implementation example:
<!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>
Instructions:
The cursor attribute defines the cursor shape used when the mouse pointer is placed within the bounds of an element.
When the attribute value of the cursor attribute is "not-allowed", the mouse cursor shape is a prohibited pattern.
The cursor attribute has the following values. The default value is default
| ##crosshair; | crosshair Heart | The cursor appears as a crosshair | ||
| cursor: hand; #Write two to take care of IE5, which only recognizes hand. |
The cursor indicates a connection in the form of a hint (finger) | |||
| Wait/Hourglass | The cursor indicates that the current program is busy (usually A watch or an hourglass) | |||
| help | The cursor indicates that help is available at the current location (usually a question mark or a balloon) | ##cursor: no-drop; | ||
Unable to release |
cursor: no-drop; |
##cursor: text; | ||
| Text/Edit | The cursor indicates that the current position is the text content | cursor: move; | ||
| Moveable objects | The cursor implies that something should be moved | cursor: n-resize; | ||
| Change size upward (North) | Edge can move upward (North) | cursor: s-resize; | ||
| Change size downward (South) | The edge can move downward (south) | cursor: e-resize; | ||
| Toward Right change size (East) | The edge of the box can be moved to the right (East) | cursor: w- resize; | ||
| Change the size to the left (West) | The edge can be moved to the left (West) | cursor: ne-resize; | ||
| Change size up and to the right (North East) | Cursor hint box The edge can be moved to the upper right (northeast direction) | cursor: nw-resize; | Change the size up and left (North West) |
The edge can be moved up and left (North West) |
cursor: se-resize; |
Change size down to the right (South East) |
The edge can be down to the right Move (Southeast) |
||
| ##cursor: sw-resize; | Change size down and left (South West) | The edge can move to the lower left (southwest) | ||
| Automatic | The browser sets a cursor | |||
| forbidden | cursor:not-allowed; | |||
| Processing | cursor: progress; | |||
| System default | Default cursor state (usually an arrow) | |||
|
|
Customize the url position of the cursor | Note: Customize after defining Add a general cursor at the end after the cursor, in case the cursor defined by the url cannot be used |
jQuery video tutorial
,web front-end development]
The above is the detailed content of How to use CSS() to set the mouse prohibition style in jquery. For more information, please follow other related articles on the PHP Chinese website!