こんにちは、私はjquery初心者なのですが、親ページ内「A.html」に設置したiframe「B.html」の中であるボタン"D"を押したときに同じiframe内のアンカー"D"に飛ぶようにしたいのですが、B.html単体でプレビューした時には問題なく希望の場所に飛ぶのですが、iframeとしてA.htmlに設置した処、希望の場所に飛ばなくなりました。
試行錯誤をしてみたのですがどうも原因が分からず困っています。
なにとぞご協力お願いします。
ちなみに現在のコードは
「A.html」
<iframe src="B.html" frameborder="0" scrolling="0" width="☓☓" height="☓☓" marginheight="0" marginwidth="0" ></iframe>
「B.html」
・
・
・
<script>
$(function(){
$('a[href^=#]').click(function(){
var speed = 500;
var href= $(this).attr("href");
var target = $(href == "#" || href == "" ? 'html' : href);
var position = target.offset().top;
$("html, body").animate({scrollTop:position}, speed, "swing");
return false;
});
});
</script>
・
・
・
<div style="margin-bottom:10px;" id="C" name="C">
<a href="#C" >C</a>
<a href="#D" >D</a>
</div>
・
・
・
<div style="margin-bottom:10px;" id="D" name="D">
<a href="#C" >C</a>
<a href="#D" >D</a>
</div>
と言う形です。
どうぞ宜しくお願いします。
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
そういうものです。
アンカーはiframeで使えません。window.scrollToでスクロールさせることで対応可能です。
下記を参考にしてください。
http://sugutsukaeru.jp/support/320/
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript jqueryを使ったスムーススクロールのコードを書いたのですが、HTMLコード内にある、a butt 2 2022/04/14 10:59
- JavaScript javascriptで変数を組み込みたい 2 2023/01/13 09:52
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/07 21:04
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript スマフォではボタンを表示させたくない 2 2023/01/20 14:26
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- JavaScript 画像の表示位置 3 2022/12/23 08:25
このQ&Aを見た人はこんなQ&Aも見ています
-
外出時に「待たせる妻」vs イライラする「待つ夫」は日本だけ?見習いたい海外事情
夫の家事参加に積極的なイメージのある海外でも、同様の事例はあるのか。結婚カウンセラーの佐竹悦子さんに伺ってみた。
-
インラインフレーム内のアンカーに飛ばせますか?
HTML・CSS
-
インラインフレームのページ内リンク
HTML・CSS
-
iframeの中でページ内リンクはできますか?
HTML・CSS
-
-
4
<a target=_top" href="***.html">が反応しない"
HTML・CSS
-
5
iframe内の特定の場所にジャンプする方法
HTML・CSS
-
6
<IFRAME>でコンテンツ部分のみ表示させる方法
HTML・CSS
-
7
インラインフレーム内でリンク移動
HTML・CSS
-
8
iframeの中から親ページをスムーズスクロール
JavaScript
関連するカテゴリからQ&Aを探す
おすすめ情報
このQ&Aを見た人がよく見るQ&A
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
javascriptでスタイルを動的に...
-
URL末尾に特定の文字を含む場合...
-
javascriptテキストBOX色を元に...
-
[急ぎ] videoタグで埋め込んだm...
-
checkboxにチェックを入れると...
-
mysqlのINSERT文の重複回避の条...
-
jTweetsAnywhereでハッシュタグ...
-
HTMLとJavaScriptで作ったタイ...
-
マウスオーバーにてdivの切り替え
-
UWSC(マウス自動化ソフト)に...
-
10秒後に1秒ごとに1行づつ表示...
-
123456789の順番の並...
-
テキストボックスに入力された...
-
スタイルシートで画面を上下に...
-
JavaScript スライドの画像にリ...
-
textareaに画像を表示したい
-
アコーディオンメニューの開閉制御
-
キャラクターがぴょこんと飛び...
-
OpenCV での画素値の比較について
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
MAX関数を使ってからLEFT JOIN...
-
HTMLタグに複数のクラスを設定...
-
変数名をどのようにつけるのが...
-
401エラードキュメントを401.ht...
-
javascriptテキストBOX色を元に...
-
読み込んだQRコードをフォーム...
-
タブで開いてさらにタブ内をア...
-
createElementで作成した要素を...
-
removeEventListenerについて
-
表示・非表示のスクリプトで、...
-
HTMLとJavaScriptで作ったタイ...
-
HTMLとJavaScriptで作ったタイ...
-
getElementByIdの戻り値がnull...
-
指定したパスが現URLに含まれて...
-
[急ぎ] videoタグで埋め込んだm...
-
IFRAMEの表示/非表示を切り替え...
-
iframe内のリンクが飛ばないの...
-
removeAttribute()メソッドで削...
-
背景色を透明化
-
jQueryで同じid属性が複数あっ...
おすすめ情報