A 回答 (3件)
- 最新から表示
- 回答順に表示
No.3
- 回答日時:
ANo1、2です。
>モーダルというのが別ウィンドウではなくて、下記のようにソースが書かれています
あらら・・・
いわゆる「モーダルウィンドウ」ではないのですね。
まるっきりの勘違い・・・というかわかりにくいご質問。
>ここが動きが近いです。
その参考サイトに作成方法が丁寧に書いてありますが、ここの限られた回答欄に私が書くよりもよほど情報量が多いはずと思います。
>localhashではうまく動きませんでした。。。
ページ内のコンテンツなので、別ウィンドウの時とは考え方がまるきり違います。
クリックによってその内容の表示/非表示を制御したり、重ねて表示するために位置の調整などが必要になります。
(詳しくは、ご提示の参考サイトをご覧になれば解説してあると思います)
スクリプト等を自作するのが面倒だというのであれば、lightbox風のライブラリは数多く作成されていますので、気に入ったものをご利用なさるのが簡単かと思います。
大抵のものがinlineコンテンツや外部ファイルの読込にも対応していると思います。
例えば
https://github.com/mjackson/shadowbox
http://fancyapps.com/fancybox/
No.2
- 回答日時:
ANo1です。
別ウィンドウを開くので、リンク要素でないと勝手に思い込んでいましたが、対象がリンク要素なのですね。
失礼しました。
>モーダルを開いたときにすでにアンカーに飛んだ状態にするのが、どうすればいいかわかりません。
普通に、URIにハッシュを設定して
<a href="hogehoge.htme#target">ほげほげ</a>
とすれば、hogehoge.htmlに遷移して、targetが表示されるようになりますよね?
モーダルで呼び出す場合でもURIの意味合いは同じなので、表示先のHTML内にアンカーを設定しておいてください。
>呼び出し元側のウィンドウでアンカー要素をクリックすると、スクリプト実行後に通常のアンカーをクリックした動作をしますので、それを中止したい場合は、
return false;
などを行う必要があります。スクリプト内から行う場合は
preventDefault()
などを実行する必要があります。
https://developer.mozilla.org/ja/docs/Web/API/Ev …
>教えていただいた記述ですと下記のように書けばよろしいのでしょうか?
参考サイトの説明にあるように、elementはクリック対象となる要素、targetは表示先ドキュメント内のアンカー、argumentsは表示先に渡すする引数ですが・・・
わからない場合は
<a href="#" onclick="showModalDialog("hogehoge.html#target", null); return false;">aaa</a>
とかでいけませんか?
(URIは状況に合わせた内容に変えてください)
通常はモーダルウィンドウからの入力値などを受け取ると思いますので、上記のような処理ではすまないとは思いますが、その後何をなさりたいのかわからないので、とりあえずご質問の内容に沿った部分だけです。
ありがとうございます。
モーダルというのが別ウィンドウではなくて、下記のようにソースが書かれています。
<a href="#hogehoge">xxxxx</a>
<div id="hogehoge">
<!--モーダル内の中-->
<a href="#hoge01">アンカーリンク</a>
<div id="hoge01">
表示内容
</div>
</div>
https://syncer.jp/jquery-modal-window
ここが動きが近いです。
lightbox系のモーダルです。
xxxx をクリックして 表示内容 の箇所に飛んだ状態にしたいのですが、
localhashではうまく動きませんでした。。。
No.1
- 回答日時:
スクロールしなければいけないようなダイアログのレイアウトや仕様に疑問を感じますが・・・
とりあえず、そのまま素直に記述すればいけるのでは?
element.onclick = function(){
showModalDialog("hogehoge.html#target", arguments);
}
<参考>
https://developer.mozilla.org/ja/docs/Web/API/Wi …
ありがとうございます
1つ引っかかっているのが、
モーダルを開くフックとして #(ハッシュ)をaタグに使っています。
モーダル内のアンカーリンクも#を使っているため、モーダルを開いたときにすでにアンカーに飛んだ状態にするのが、どうすればいいかわかりません。
教えていただいた記述ですと下記のように書けばよろしいのでしょうか?
初心者ですいません、、よろしくお願いいたします。
<script>
element.onclick = function(){
showModalDialog("#target", arguments);
}
</script>
<a href="element">aaa</a>
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- Excel(エクセル) Excelで図の書式設定を移動したい 1 2022/10/07 15:32
- デスクトップパソコン ファイルメーカーPro12が突然起動しなくなりました 1 2023/08/23 11:47
- その他(コンピューター・テクノロジー) <a href="file:///フォルダ名/ファイル名">リンクテキスト</a>について 1 2023/04/06 22:40
- Windows Me・NT・2000 IMEオプションが開かない 2 2023/04/07 18:04
- Chrome(クローム) Google Chromeのブラウザ(PC)ウインドウの移動について 3 2022/07/19 15:14
- Windows 8 QTTabBarが無反応になる 2 2023/04/07 14:17
- その他(プログラミング・Web制作) VBSでExcelファイル起動時、重複しても開くのを止めたい 1 2022/10/01 23:20
- X(旧Twitter) Twitterで相手にメッセージを送った際、例えば千葉県と書いたところがリンクありになりました。クリ 1 2023/02/18 06:52
- Windows 10 windows11 update の「更新の再開」について初歩的な質問なのですが 1 2022/10/19 00:57
このQ&Aを見た人はこんなQ&Aも見ています
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
Javascript_submit()完了後に処...
-
エクセルのシート上に別のシー...
-
ポップアップと作業ウィンドウ...
-
インタネットからPDFファイルだ...
-
ウィンドウの2重起動を防止したい
-
履歴を残さないResponse.Redire...
-
子ウィンドウを常に手前表示、...
-
新しく開いたウィンドウへの要...
-
ブラウザ(IE)からエクスプロー...
-
タスクバーに非表示
-
子ウィンドウの存在確認
-
チェックボックス付きツリービュー
-
VBAで任意のウインドウのサイズ...
-
別フレームのページを更新させたい
-
助けてGmailでボタン表示が消え...
-
Javascript 親から設定したaddE...
-
VBScriptでリンクをクリックし...
-
1クリックでモーダルを開いてか...
-
サブウィンドウから親ウィンド...
-
デジタル時計の時刻合わせの方...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
エクセルのシート上に別のシー...
-
Javascript_submit()完了後に処...
-
VBAで任意のウインドウのサイズ...
-
ウィンドウの2重起動を防止したい
-
VBの画面で、全ウィンドウを一...
-
ポップアップと作業ウィンドウ...
-
子ウィンドウから親ウィンドウ...
-
ウィンドウ名からウィンドウオ...
-
子→親ウインドウへデータを受け...
-
子ウィンドウの存在確認
-
子ウィンドウから親ウィンドウ...
-
window.openで新しいページを後...
-
<EXCEL/VBA> OUTLOOKのウインド...
-
親ウィンドウから開いた子ウィ...
-
window.Openをモーダルにできま...
-
1クリックでモーダルを開いてか...
-
孫ウインドウを閉じたら親をリ...
-
子ウィンドウの「閉じる(×)」...
-
JavaScriptで指定Windowを最大...
-
助けてGmailでボタン表示が消え...
おすすめ情報