Q&A
ワードプレスでサイトを作成しています。
トップページに最初にアクセスしたときのみローディングを表示したいです。
（ほかのページからトップページに戻ってきたときにローディングが表示されないようにしたい）
あまりjavascriptに詳しくなく、javascriptのコードのどこにどう記載すると良いのかわかりません。
教えていただけるとありがたいです。
JavaScriptの記載は以下です。
JavaScript
1<script type="text/javascript"> 2$('head').append( 3 '<style type="text/css">#container { display: none; } #fade, #loader { display: block; }</style>' 4); 5 6jQuery.event.add(window,"load",function() { // 全ての読み込み完了後に呼ばれる関数 7 var pageH = $("#container").height(); 8 9 $("#fade").css("height", pageH).delay(900).fadeOut(800); 10 $("#loader").delay(600).fadeOut(300); 11 $("#container").css("display", "block"); 12}); 13</script>
htmlは以下です。
html
1<html> 2 <body> 3 <div id="loader"> 4 <div class="loading">Loading...</div> 5 </div> 6 <div id="fade"></div> 7 <div id="container"> 8 サイトのコンテンツがここに入る 9 </div> 10 </body> 11</html>
以上、お分かりの方いらっしゃいましたらよろしくお願いいたします！
回答3件
0
ベストアンサー
私であればlocalStorageを利用します。
javascript
1window.onload = function () { 2 if(localStorage.getItem('loading') === null || localStorage.getItem('loading') != "1"){ 3 //ローディング実行 4 5 localStorage.setItem('loading',"1"); 6 } 7 8}; 9
ただ、これだと本当に１回しかローディング表示されないため、
ページが更新されたりしてローディング挟みたい場合はどこかで下記を入れる必要があります。
javascript
1localStorage.removeItem('loading');
投稿2018/03/15 02:33
編集2018/03/15 02:38
総合スコア80850
0
文中そのままの通り「ほかのページからトップページに戻ってきたとき」であれば、
リファラでいいと思います。
referrerに自分のサイトルートが含まれていれば、で。
ただ、sessionStorageとかCookieとか使ってみるのもありかと思います。
投稿2018/03/15 02:20
編集2018/03/15 02:21
総合スコア3404
0
Cookieを使うのはどうでしょうか？
初回時にCookieを付与して、以後そのCookieがある場合は、ローディングの関数を実行しないようにすると目的が達成できるかと思います。
jQueryを使っているなら、jQuery.cookie.jsを使うと便利です。
投稿2018/03/15 02:12
総合スコア20
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/04/25 07:40