0

私はいくつかのサイトを作成したことがあり、基本的な html、javascript、および php を知っています。

最近、サイトthemefinder.dkを作成しました。これは、最初の読み込み時を除いて、意図したとおりに機能します。画像は、正しい位置に移動する前に、数秒間「ずれて」表示されます。ここに写真があります。

私の問題は、これにどう対処するかです。

これに影響していると思われるいくつかのことがわかりました:
- .image クラスから position:absolute を削除すると、読み込みの問題は解決しますが、ページが意図したとおりに表示されません。
- ページに大量の DOM 要素があります。
- JavaScript は document.ready で実行されます

上記をいじってみましたが、まだ成功していません。これを解決する方法についてのアイデアや考えは大歓迎です。

私は現在 ajax を調べて、方法を見つけたり、読み込まれた画像の初期量を減らしたりしています。しかし、私はまだそれを経験していないので、ajaxについてもっと学ぶ間、解決策があれば素晴らしいでしょう.

HTML 構造やサイト上の何かについて詳しく説明する必要があるかどうかを教えてください。どんな助けでも大歓迎です。

よろしく
アンダース

4

1 に答える 1

0

画像の読み込みに ajax を使用する必要はありません。ページが読み込まれるとすぐに、javascript で画像要素を作成できます。

var yourimage = $("<img />").attr('src', 'http://yourimageurl.com/image.jpg')
                      .load(function() {
                         if (!this.complete || typeof this.naturalWidth == "undefined" || this.naturalWidth == 0) {
                             alert('Can\'t load image');
                         } else {
                             $("#someid").append(yourimage);
                         }
                      });
于 2012-06-22T09:15:10.627 に答える