いくつかのセクションに分かれたウェブサイトを作っています
<div id='section-1' class='section'>web content</div>
<div id='section-2' class='section'>web content</div>
Web ページに 10 個のセクションがあり、各セクションの高さは、JavaScript によってドキュメントの準備ができたときにユーザー ウィンドウの高さに設定されます。
$('.section').height($(window).height());
私の Web ページのスライドショーなどの一部の効果は、正しく機能するためにセクションの計算された高さが必要です。したがって、私は常にドキュメントの準備ができているときにこのようなものをソリューションとして使用しています。
setTimeout(startslideshow,1000);
setTimeout(startanimations,1000); ...etc
セクションの高さがスライドショーのコード開始前にユーザーウィンドウの高さであることを確認するには、Webページが読み込まれるとすぐにセクションをユーザーウィンドウの高さに変更できないため、計算された位置が間違っているなど、スライドショーコードで深刻な問題が発生します。
したがって、ページがロードされた後、すべてが正常に機能する前に、すべてが台無しになる約 1 秒の状況が発生します。ユーザーに表示されないようにするにはどうすればよいでしょうか? $(document).hide()、または、1秒後にフェードインしようとしまし$('html,body').hide()たが、特にiPadで他の奇妙な問題が発生し、ユーザーがスクロールしている間、固定位置のトップナビゲーションバーが常に「固定されていません」になります。
私は自己学習者であるため、私の方法は一般的ではありません。Web ページをさまざまなセクションに分割し、その高さを window height に設定する必要がある場合に、実際の Web プログラマーが通常行う一般的な方法を知りたいです。次に、セクションの高さに依存する他の効果が適切に機能することを確認し、高さの変化を少し待ちますか？