Q&A
###前提・実現したいこと
iframeを入れ子にしているのですが、孫htmlにあたるhtml内でスムーススクロールを実現したいのですが、
上手く動きません。。
子のhtmlからでしたら下記記述で上手く動きました。
js
1$(function() { 2 $('a[href^=#]').on('click', function() { 3 var speed = 400; 4 var href= $(this).attr("href"); 5 var target = $(href == "#" || href == "" ? 'html' : href); 6 var position = target.offset().top + 700; 7 $( 'html,body', parent.document ).animate({scrollTop:position}, speed, 'swing'); 8 return false; 9 }); 10});
###該当のソースコード
index.html（親）
html
1<body> 2<div id="wrapper"> 3 <div class="frame"> 4 <iframe src="example.html" name="mainframe" id="mainframe"></iframe> 5 </div> 6</body>
example.html（子）
html
1<body> 2<div id="wrapper"> 3 <div class="frame"> 4 <iframe src="scroll.html" name="subframe" id="subframe"></iframe> 5 </div> 6</body>
scroll.html（孫）
html
1<body> 2<div id="wrapper"> 3 <ul> 4 <li><a href="#a01">・アンカー1</a></li> 5 <li><a href="#a02">・アンカー2</a></li> 6 </ul> 7 <div class="box"> 8 <div id="a01"></div> 9 <div id="a02"></div> 10 </div> 11</body>
js
js
1$(function() { 2 $('a[href^=#]').on('click', function() { 3 var speed = 400; 4 var href= $(this).attr("href"); 5 var target = $(href == "#" || href == "" ? 'html' : href); 6 var position = target.offset().top + 700; 7 $( 'html,body', parent.document ).animate({scrollTop:position}, speed, 'swing'); 8 return false; 9 }); 10});
###試したこと
前述したように子のhtmlにアンカーリンクを設定した場合は上手く動きました。
孫のhtmlから親のhtmlのスムーススクロールを実行する書き方があるのでしょうか。。。
あまりjsに強くないので、他に記述の仕方があるのか、参考サイトでも構いませんのでアドバイスいただけますと大変助かります。
よろしくお願いいたします！
ベストアンサー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/12/07 13:57
2016/12/07 14:07
2016/12/07 14:29 編集
2016/12/07 14:46