前提・実現したいこと
wordpressでwebページを制作しています。
任意IDへのリンク(http://example.com/#target)を開いた際に
ページ内容をすべて読み込んだあとjQueryで該当場所までスクロールをさせたいです。
(もしjQueryではなく指定場所を表示させる方法があればそれでも可です)
発生している問題・エラーメッセージ
任意IDへのリンクを開いた際、
そのリンクの上部にTwitterの埋め込み
(iframeでのタイムライン表示、埋め込みウィジェットなどtwitter公式のもの)があると、
スクロール後に埋め込み部分が読み込まることがあり、その分表示が下にずれてしまいます。
たまにサイトが重く、ページが読み込まれる前に埋め込み部分が読み込まれている場合は
意図した場所にスクロールされるため、埋め込みツイートが原因ではないかと思いました。
とくに<twitterwidget>というタグで表示されるtwitter埋込み型ツイートに関しては、
開発者ツールでは表示が確認できますが、
ソース上は
試したこと
jQuery
1$(window).on('load', function() { 2 var hash = window.location.hash; 3 var position = $(hash).offset().top; 4 position = position; 5 function scroll(position){ 6 $('html, body').animate({ 7 scrollTop : position 8 }, 100); 9 } 10 scroll(position); 11});
上記コードでページの画像等読み込みが終わったあとにスクロールをする、という点は実現できました。
このスクロールのあとにTwitter埋め込みが読み込まれた場合ずれてしまうように思います。
補足情報(FW/ツールのバージョンなど)
wordpress 4.9.5
jquery 1.12.4
twitter埋込み型ツイート
http://westplain.sakuraweb.com/translate/twitter/Documentation/Twitter-for-Websites/Embedded-Tweets.cgi
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/09/03 06:52