Front End Programming
  1. ホーム
  2. ブログ一覧
  3. たった8行!簡単PopUpWindow

たった8行!簡単PopUpWindow

JavaScript

手間がかからずたった8行で簡単にJQueryで実装できるのでメモしてます。そのかわり、素っ気ないしまったくオシャレじゃないです。ご了承ください。

この記事を書いた人

かみーゆ/フロントエンドエンジニア

セブ島在住の気ままなフリーランスエンジニア。テクニカルディレクター・エンジニア講師・ブリッジSEを経て今に至る。CMS concrete5エバンジェリスト。テックブログ以外も「磨耗しない人生の選択」や「海外生活」のライフスタイルについて発信。好きなものは肉とビール。

Read More

とにかく簡単にガスっと実装したいときにどうぞ

JSのwindow.open()を使って別Windowでリンクを開きます。 いたってシンプルです。

jQueryだとこんな感じのコードでOK。

ポップアップを設定したいリンクの任意のクラスの名前を付けるだけ。

//jQuery
<script>
    $(function() {
        $("クラス名").click(function(){
            window.open(this.href, "WindowName", "width=〇〇, height=〇〇,resizable=yes,scrollbars=yes");
            return false;
        });
    });
</script>

//HTML
<a href="開きたいファイルのリンク">PopUpWindowOpen</a>

まとめ

ちょっとしたこと、些細なことの方がいざとなったら忘れてしまうんですよね。 解説や肉付けが必要なら、後日追記でもいいので忘れないうちにメモっておくことは大切だなーって思います。

日々Tipsをストックしておくと後日、すごく助けられますからね!!

関連記事もあわせてお読みください

Web制作に関する人気の記事

海外移住・ライフスタイルに関する人気の記事

キャリアアップ・転職に関する人気の記事