1

divにデータを入力するための大量のphpコードを含むホームページがあります（検証を伴うニュースレターのサインアップ、mysqlデータベースのコンテンツ、さまざまな静止画像を含む）。ページ全体は、背景のクロスフェードJavaScriptの上に構築されています。

それはすべてうまく機能し、見栄えがします.....ただし、ページをロードするときに表示される最後の「div」は背景画像です-すべてのdivがロードされ、背景画像が読み込まれるまで、効果的に大きな「空白」を作成しますレンダリングされます。

ユーザーがサイトに移動するときにこの空白が残らないように、最初の背景画像を何よりも先に読み込む方法はありますか？

ロールオーバーイメージの使用で見たことがありますが、ロールオーバーバージョンはスクリプトにプリロードできます-これは、そのようなソリューションを探すときに採用するのに最適な方法ですか？

どんな助けやアドバイスも大歓迎です-必要に応じてコードを表示してください-私のスクリプトにある量を考えると、それがあまりにも役立つとは思っていませんでした!!

ありがとうJD

4

6 に答える 6

3

あなたの問題は画像がロードされる順序だと思います。

背景画像が他のすべての要素の後に読み込まれる場合は、背景画像ができるだけ早く読み込まれるようにしてください。背景画像がdivCSSプロパティbackground-image：url（myimage.png）を持つ場合は、CSSファイルをheadタグに含めます。

また、背景画像をpngインターレースとして保存することもできます。（フォトショップの場合：Webおよびデバイス用に保存> png24>ティックインターレース）。このようにすると、画像はすぐに低品質で表示され、データがブラウザに転送されるにつれて改善されます。

jQueryを使用して画像の読み込みを制御する場合は、次の質問をご覧ください：jQueryを使用した画像の事前読み込み。しかし、あなたの問題は要素がロードされる順序であるため、これがあなたにとって役立つとは思えません。

于 2011-11-02T00:00:04.597 に答える
1

JSで画像をプリロードしてみましたか？

このようなもの：

<script type="text/javascript">
    bg = new Image();
    bg.src="background.png";
</script>
于 2011-11-03T21:42:56.107 に答える
1

httpリクエストを分離します。

したがって、ページは背景画像を含み、要素が少ないページのままです。

javascriptを使用して、ページのコンテンツをロードするajaxリクエストを作成し、このajax関数を$（document）.ready（）関数にフックします（jqueryを使用する場合、それ以外の場合はwindow.load関数を使用できます）。ページがロードされた直後にロードされます。

于 2011-11-04T04:30:30.157 に答える
0

HTML5で指定されているクライアント側のキャッシュファイルの使用を検討することもできます。
これは、ユーザーが初めてサイトにアクセスしたときに画像が読み込まれるのを待たなければならないため、完全には解決しませんが、同じユーザーが次に戻ってくるときにパフォーマンスを大幅に向上させることができます。詳細については、こちら
をご覧 ください。

于 2011-11-04T12:56:50.193 に答える
0

uはjqueryを使用するかどうかを指定しませんでした。

jquery がImage.load関数を呼び出す場合。そのコールバックでは、すべてのjsを使用するため、その画像のロード後にjsが呼び出されます。

于 2011-11-04T13:03:42.293 に答える
0

JSを使用せずにこれを実行する場合は、ページの本文の下の最初の項目としてdivまたはimgタグを含め、そのimgタグスタイルをdisplay：noneに設定できます。最初に画像が読み込まれるため、後で使用する場合は、画像を読み込んで表示できるようにする必要があります。

于 2011-11-04T13:13:41.520 に答える