検索

ホームページ  >  記事  >  ウェブフロントエンド  >  CSS()を使用してjqueryでマウス禁止スタイルを設定する方法

CSS()を使用してjqueryでマウス禁止スタイルを設定する方法

青灯夜游
青灯夜游オリジナル
2022-05-07 20:30:231943ブラウズ

方法: CSS() を使用して、マウス スタイル属性「cursor」の値を「not-allowed」に設定するだけです。構文は「element object.css("cursor","not-allowed"」です) )」または「element.css({"cursor":"not-allowed"})」。

CSS()を使用してjqueryでマウス禁止スタイルを設定する方法

このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

マウス禁止スタイルを設定したい場合は、cursor 属性を使用するだけです。

CSS() を使用して、マウス スタイル属性「cursor」の値を「not-allowed」に設定するだけです。

設定構文は 2 つあります: 

元素对象.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>

CSS()を使用してjqueryでマウス禁止スタイルを設定する方法

手順:

cursor 属性は、マウス ポインターが要素の境界内に置かれたときに使用されるカーソルの形状を定義します。

カーソル属性の属性値が「不可」の場合、マウスカーソルの形状は禁止パターンとなります。

カーソル属性には次の値があります。デフォルト値はdefaultです

##カーソル: ポインタ; カーソル: 待機;カーソル: help;#Text/Editcursor: move;#エッジは下 (南) に移動できますボックスの端を右(東)に移動できますエッジは移動できます左 (西)カーソルヒントボックス エッジを右上(北東方向)に移動できます#エッジを上下左右に移動できます (北西)cursor: se-resize;サイズを右下 (南東) に変更します #端を右に下げることもできます 移動 (南東)##cursor: sw-resize;#カーソル: 自動;#cursor:許可されていない;処理中カーソル: 進行状況;#システムデフォルト#ユーザー定義 (アニメーションあり)jQuery ビデオ チュートリアル 、Web フロントエンド開発
##crosshair;

 十字線ハート

 カーソルは十字線として表示されます
カーソル: 手; #Write手だけを認識する IE5 を処理するために 2 つあります。



#手

カーソルはヒント (指) の形で接続を示します


待機/砂時計

カーソルは、現在のプログラムがビジーであることを示します(通常は時計または砂時計)

help

カーソルは、現在の場所でヘルプが利用できることを示します (通常は疑問符またはバルーン)

#cursor: no-drop;
リリースできません

 カーソル: ドロップなし;

 ##カーソル: text;

カーソルは、現在の位置がテキスト コンテンツであることを示します

#移動可能なオブジェクト
#カーソルは、何かを移動する必要があることを示します

カーソル: n-resize;

サイズを上方向に変更 (北)
エッジは上に移動できます (北)

cursor: s-resize;

サイズを下に変更します (南)

カーソル: e-resize;

右方向にサイズ変更(東)

カーソル: w- サイズ変更;

サイズを左(西)に変更します

cursor: ne-resize;

サイズを上と右に変更します (北東)

カーソル: nw-resize;

 #サイズを上下左右に変更します (北西)

サイズを変更下と左 (南西)

エッジは左下 (南西) に移動できます

##自動

ブラウザはカーソルを設定します

禁止

 #カーソル:許可されていない;

#カーソル: 進行状況;

cursor: デフォルト ;

デフォルトのカーソル状態 (通常は矢印)

cursor: url(' # ');

# = カーソルファイルアドレス


カーソルの URL 位置をカスタマイズします 		注: 追加を定義した後にカスタマイズしますURL で定義されたカーソルが使用できない場合に備えて、カーソルの後ろにある一般的なカーソルです。

カーソル属性には非常に多くの値があると言えるでしょう。 、どうやって覚えるの？実際の開発では、通常「default」と「pointer」の 2 つの属性値のみを使用し、その他の属性値はほとんど使用されません。どうしても他に何か必要な場合は、戻ってこのような表を確認してください。

[推奨学習:
]

以上がCSS()を使用してjqueryでマウス禁止スタイルを設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事：jqueryにはいくつかの基本的なセレクターがあります次の記事：jqueryにはいくつかの基本的なセレクターがあります

関連記事

続きを見る