エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
簡単なモーダルウィンドウの作り方を調べてみる|クリエイターブログ|東京都新宿区のWeb制作会社 - ウェブラボ
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
簡単なモーダルウィンドウの作り方を調べてみる|クリエイターブログ|東京都新宿区のWeb制作会社 - ウェブラボ
こんにちは、クリエイターブログです。今回は簡単なモーダルウィンドウの作り方ついて紹介したいと思い... こんにちは、クリエイターブログです。今回は簡単なモーダルウィンドウの作り方ついて紹介したいと思います。 従来jQueryなどのプラグインを用いて運用することが多いモーダルウィンドウですが、もっと簡単に今なら実装できるんじゃないかと思い方法を調べてみました。 そこで、現状一番簡単そうな方法を紹介がてら試しに実装してみようと思います。 今回用いるのはdialogタグを用いてjavascriptのshowModal()メソッドを利用する方法です。 以下の開発者向けドキュメントにも書いてある通り、主要ブラウザは一通り対応されています。 →HTMLDialogElement: showModal() メソッド – Web API | MDN それとCSSの疑似クラス:modalを合わせて使用します。 こちらは一部対応されて無いものもありますが、あまり気にしなくてもいいでしょう。 →“:modal”