javascript この機能はなんという名前ですか？

Question

ログインなどのボタンを押した時に画面が遷移することなく
以下の画像のような状態で画面に表示される機能に名前はあるのでしょうか？
名前がわからず調べようがなかったので知っている方がいましたら教えてください。

また参考になるコードやサイト等ありましたら提示していただけると大変助かります。

参考サイトprogateログイン画面

Answer 1

ダイアログ（会話という意味。ユーザーに何かを知らせるor何かを入力してもらうことから）ボックスですが、背景が暗くなっているようなので、おそらく表示されたダイアログの操作以外できなくなっていると思われますので、モーダルダイアログ（モードが切り替わった状態のダイアログ）です。
参考： Wikipedia モード (ユーザインタフェース)

ダイアログが表示されていても背景部分の操作ができる場合は、モードレスダイアログ（モードが切り替わらないダイアログ）です。

ダイアログボックスをモーダルにするのか、モードレスにするのかは、きちんと検討が必要です。
モーダルなダイアログにイラっとしたことは無いですか？

Answer 2

モーダルですかね。

使い分けがわからなかったので軽く調べました。
【初心者向け】モーダル・ポップアップ・ダイアログの意味の違い

「モーダル(modal)」「ポップアップ(pop up)」「ダイアログ(dialog)」は、いずれも画面に被さるようにして表示される小さなウィンドウを指して使うことが多い単語です。

これらについて、「どれも聞いたことはあるし、自分でもなんとなく使ってるけど、明確な違いはわからない」という方も多いのではないでしょうか。

そこで、この記事では、「モーダル」「ポップアップ」「ダイアログ」の違いを初心者にもわかりやすいように解説していきます。

モーダルかダイアログかって感じですね。
どちらでも良いと思います。

Answer 3

ダイアログです。
https://cccabinet.jpn.org/bootstrap4/components/modal

Answer 4

たぶんModalだと思います。

Modal · Bootstrap

こういうのであってますか？

面倒なので、私はいつもBootstrapをそのまま使うだけので、実装方法とかまではわかりません。

Comments

[encho]

大変参考になりました。
一番早い回答でしたのでベストアンサーにさせていただきます。

[raccy]

一番早いのはSecretさんですよ…

[encho]

すみません。。ミスでした。。
Secretさんにベストアンサーをつけさせていただきます。
大変申し訳ありません。

Answer 5

モーダルダイアログではないですか？

dialog.showModal()