JavaScriptライブラリjQueryで指定要素を目立たせるプラグイン「expose」

フォームなどでは入力中に周りに余計なものが見えると入力がしにくかったりします。
そんな時はjQueryプラグイン「expose」を使用すると、目立ってわかりやすくなります。

使用方法

exposeからtools.expose-1.0.2.jsをjquery.jsをダウンロードします。

<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript" src="tools.expose-1.0.2.js"></script>
<script>
$(function() {
	$("要素名").click(function() {
		$(this).expose({
			maskId: 'mask', //マスクさせるid名
			onLoad: function() {
				this.getExposed().css({backgroundColor: '#c7f8ff'}); //要素の背景色
			},
			onClose: function() {
				this.getExposed().css({backgroundColor: null});
			},
			api: true
		}).load();
	});
});
</script>
上記を記述したら、書き込んだ要素名を記述すれば完成です。
なおマスクの見た目は以下のように指定します。

#mask {background:#678;}

サンプル



Javascriptサンプルページ一覧
skuare.net