最初からモーダルウィンドウが表示され、閉じるボタンでページが見られるようにしたい

Question

https://webdesignday.jp/samples/p4680/sample1/
上記はクリックでモーダルウィンドウを表示、「閉じる」ボタンでモーダルウィンドウを閉じます。

ページを開くとき、もうすでにモーダルウィンドウが表示し、「閉じる」ボタンでモーダルウィンドウを閉じるようにしたいです。
例えばあなたは18歳ですか？「はい」ボタンをクリックして見られるようにするといったものです。
検索してみましたが、なかなか見つかりませんでした。
お力を貸してください。宜しくお願いします。

Comments

[m.ts10806]

まず自身が思ったように組んでみては如何でしょう。
大抵のものは素材であり「自分が作りたいそのもの」なんてどこにも落ちてません。組み合わせるしかないのです。それに「お力を貸してください」だけではどういう確度で何を求めているのか他者には分かりません。

[m.ts10806]

あとHTML,CSS,JavaScriptではやろうと思えば閉じるクリックしなくても勝手に見ようと思えば見れます。それでいいのでしょうか。

Answer 1

confirmで十分では？

var flg=confirm('18歳以上?');
if(!flg) location.href="https://google.com";

必要ならflgをチェック後にページ本体をfetchなどで呼び込む手もあります

Comments

[kmyr]

参考にさせていただきます。

Answer 2

色々とアドバイスをありがとうございました。

Comments

[m.ts10806]

この回答のどこが「最も参考になった回答(ベストアンサー)」なのでしょうか。

Answer 3

ページを開くとき、もうすでにモーダルウィンドウが表示し

仕組み分かってればできることです。
多くのモーダルは要素をhiddenにしておき何らかのトリガーでhiddenを解除して表示させます。
であれば最初からhiddenをなしにすれば画面上に出てきます。
あまり拾ってきた仕組みをいじりたくないのであれば、「何らかのトリガー」を「画面ロード」にしても良いでしょう。

---

とは言っても、既に書いたように、「はい」押さなくてもHTML,CSS,JavaScriptで書かれたものであればブラウザの開発ツールで改ざんできるので、勝手に閉じることができます。
実現したいことは本当にそれでいいのか？考える必要があります。
場合によりサーバーサイドの仕組みと連携させる必要もあるでしょうし。

Comments

[kmyr]

参考にさせていただきます。