Tool & Snippet

WEB系/3DCG・映像系に関すること

JavaScriptのノーマルなポップアップウィンドウ

jQueryを使って使い回しできるポップアップウィンドウのイベントと作る。

仕様:

  • HTML側でURLを設定
  • window.open()を使用する
  • ポップアップウィンドウのサイズ:横幅700px 縦幅400px
HTML CODE:
<a class="iMovie" href="https://www.google.co.jp">ポップアップウィンドウ</a>
JS CODE:
	jQuery(".iMovie").on("click", "a", function(e){
		e.preventDefault();
		var target = jQuery(this).attr("href");
		window.open(
			target,
			'data',
			'toolbar=no,location=no,status=no,menubar=no,scrollbars=yes,width=700,height=400'
		);
		return false;
	});
おわりに。

アンカーのクラス名はお好きな名前を設定してください。
最近はライトボックスプラグインが主流なので、あまり使う機会がありませんが、
クライアントによっては必要なことがあるのでメモ程度に記録しました。
ご参考に。