今日の人気記事

まだデータがありません。

ヘルプメッセージなどをポップアップで表示「jqModal」 - jQueryプラグイン

当ページのリンクには広告が含まれています。

スポンサーリンク

ヘルプメッセージなどをポップアップで表示するプラグイン「jqModal」を紹介します。

jqModal

このプラグインを使えば、さまざまなメッセージをポップアップ(モーダルウィンドウ)表示することができます。要素を指定するだけなので、簡単に実装することができます。

フォーム入力ページのヘルプメッセージなどを作成する場合に便利かもしれませんね。

スポンサーリンク

デモをご覧ください。

「jqModal」のデモ

ソース(HTML + jQuery)


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="jqModalのデモでーす。">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="jqModal.js"></script>
<link type="text/css" rel="stylesheet" media="all" href="jqModal.css" />
</head>
<body>
<h1>jqModalのデモでーす</h1>

<div>
<a href="#" class="jqModal">ここをクリック!</a>
</div>

<div class="jqmWindow" id="dialog">
<a href="#" class="jqmClose">Close</a>
<hr>
ここにメッセージを記述します。
<br /><br />
あああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ
</div>

<script>
$().ready(function() {
	$('#dialog').jqm();
});
</script>

</body>
</html>

jsファイルのダウンロード、その他のオプション詳細はこちらからどうぞ。
» jqModal

スポンサーリンク

関連記事(一部広告含む)