Web制作

ねこやま猫道サイトリニューアル覚書3/3・ページローディング表示

6枚の画像をスライドショーにしていますが、画面の読み込みに時間がかかり、スライド部分よりも下のコンテンツが先に表示されてしまうので、ローディング表示を使用することに。

PACEは設置も簡単でしたが、設置後もスライドより下のコンテンツが先に表示されてしまうので、ドキュメントをあたりましたがイマイチついていけませんでした。

色々探して、ローディング中はページの内容を非表示にしてロード後に表示させる方法を実装した方の記事をみつけ、こちらを参考にしました。記事のようにすべての読み込みを完了するまでローディング表示にしたかったのですが、javascriptの理解が足らないためかうまくいかないので、苦肉の策で、スクロールしないで見える部分は部分的に表示されてもよいこととし、スクロール後のページ内容(スライドショー以降すべて)をローディング中に非表示にするという実装に落ち着きました。

今更ながら、「ローディング画面」で検索すると色々出てくるので、再チャレンジするかもしれません。