ホームページ内のポップアップへの直リンク

ホームページがAとBの２つあって、Aの特定のページでクリックするとポップアップが出てくる部分があるのですが、Bに挿入したリンクを１クリックで直接そのポップアップまで飛ぶことってできますでしょうか？

アンカーとかでポップアップがある部分まで飛ばすことはできそうなのですが、一機にポップアップが表示された状態にまでできたらなと思ったのですが方法が見つかりませんでした。

何かお分かりになる方いましたらアドバイスよろしくお願いいたします。

＊ホームページはワードプレスでどちらも作成しています。

退会済みユーザー

2021/07/08 10:12

そのポップアップを表示する仕組みは理解していらっしゃいますか？

takeke

2021/07/08 10:18

すみませんあまりよくわかっていません。。。javascriptのアクションとかでしょうか？

m.ts10806

2021/07/08 10:23

実装されてるコードを提示されたほうが良いかと思います。「ポップアップ」とひとえに言ってもやり方は一つではありませんので

退会済みユーザー

2021/07/08 10:24 編集

質問者さんが実現したい「ホームページがAとB」にてやりたいことが実現できなかったら、どんな助言も空回りでしかないので、ホームページAに仕込まれているjavascriptコードの解読やHTML構造など把握できていなければ、これ以上深められる話はありません。（あくまで私の見解ですが。）プロにアウトソースしてください。

Lhankor_Mhy

2021/07/08 10:31

Bの中にそのようなスクリプトを書かない限り、難しいと思います。

takeke

2021/07/08 10:38

なるほど、javascriptコードが必要なのですね。Aは自分で作ってなかったのでよくわかってなかったのですがjavascriptの部分調べてみます。urlの記述の方法で簡単にできるのかなと当初安易に考えていました。。。コードや記述などわかったら追記いたします。

Lhankor_Mhy

2021/07/08 10:46

ああ、すみません、BではなくてAですね。失礼しました。

m.ts10806

2021/07/08 11:48 編集

>javascriptコードが必要なのですね現状だとそれが必要かどうか判断可能な材料が皆無と言うことですね。その「ポップアップ」の実装次第。「クリックしたら立ち上がるポップアップ」だけでは全く情報になりませんので。

m.ts10806

2021/07/08 11:49

２つのサイトの関係性実装自分がどこまで手を出せるのか、管理はどうなっているのか様々な状況説明が足りていません。

行動規範の内容に同意します

回答1件

面倒だったのでポップアップを閉じる仕組みは未実装

html 1枚目

html
1<!DOCTYPE html>
2<html lang="ja">
3
4<head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Document</title>
8</head>
9
10<body>
11    <a href="2.html">2へ</a>
12    <script>
13        localStorage.setItem("key", "popup")
14    </script>
15</body>
16
17</html>

html　2枚目

html
1<!DOCTYPE html>
2<html lang="ja">
3
4<head>
5    <meta charset="UTF-8">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <title>Document</title>
8    <style>
9        #popup {
10            width: 500px;
11            height: 500px;
12            position:absolute;
13            top:50%;
14            left:50%;
15            transform: translate(-50%,-50%);
16            display:none;
17            background-color: blue;
18        }
19    </style>
20</head>
21
22<body>
23<button id="button" type="button">
24    ポップアップ
25</button>
26<div id="popup"></div>
27<script>
28    const button = document.getElementById("button");
29    const popup = document.getElementById("popup");
30
31    button.addEventListener("click", () => {
32        popup.style.display = "block";
33    });
34
35    if(localStorage.getItem('key') === "popup") {
36        button.click();
37        localStorage.removeItem('key');
38    }
39
40</script>
41</body>
42
43</html>