2011-08-15 1 views
3

私は、ユーザーがスクロールしているときに動的に画像をJavaScriptで読み込もうとしています。アプリケーション全体はオフラインで、HTMLとJavaScriptで書かれています。振る舞いの「スクロール」は、CSS3のアニメーションによって行われます。モバイルアプリケーションのJavascriptでUIをブロックすることなく画像を動的にロードできますか?

問題は、image.src = "foo.png"を設定すると、イメージがロードされるまでUIをブロックするということです。これを回避する方法はありますか?

+0

** src **属性が設定されているため、ドキュメントの高さが増加しますか?もしそうなら、レンダラーがスクロールコントロールをユーザーに返す前にこれを計算しなければならないので、これがあなたの問題だと言います。 – martin

答えて

1

UIのブロック時間はどのくらいですか?それが地元なら、私はそれをまったく考えなかったでしょう。

いずれにせよ、UIがブロックされている理由は、画像をダウンロードしてのサイズがである必要があるためです。画像サイズがわからない場合は、レイアウトにどのように影響するかわかりません。

私はどうしたら最初に考えるとすぐにタグを作成するなどの属性と高さを設定することです。

+0

イメージのダウンロードはブロック要因ではありません。 Imageオブジェクトを使用して正常にダウンロードしますが、DOM要素のsrc属性をonloadコールバックに設定すると、ブロックされます。 – DevDevDev

+0

まず、HTMLのローカルです。** onloadイベント**を使用する理由はありません.2番目の方法は、レンダラーが素早くスタイルを再計算するようにしても問題ありません。 ** width **および** height **属性を使用すると、レンダラーはこのプロセスをスキップできますか?私は、レンダラーがレイアウトがどのように変化するかを把握しなければならないように、画像が追加されるにつれて文書の高さが増加していると仮定しています(つまり、文書の高さが計算されるまでスクロールできません)。 – martin

+0

これらの変更の後、画像がロードされているがまだ目立つ間にわずか数ミリ秒間しか発生しません。違うことをしなければならない。 – DevDevDev

関連する問題