2

Android用のphonegapを使用してWebアプリケーションを開発しています。jqueryモバイルタップイベントを使用しており、タップイベントごとに、コンテンツを表示する前に読み込み中のdivを表示したい.タップイベントと読み込み中のdivの表示の間に遅延が見られます。以下は、私が書いたコードのスニペットです

    $('#events').bind('tap',function () {           
        document.getElementById("loadingDiv").style.display = "block";  
       });

そしてこれが私のloadingDiv

<div id="loadingDiv"></div>

#loadingDiv {position: fixed; background:black url('images/ajax-loader.gif') no-repeat center 20%; height:100%; width:100%; z-index:100000;}

また、Jquery モバイルを高速化するために、トランジションもオフにしました。

ユーザーエクスペリエンスを向上させるために、loadingDiv をすぐに表示する方法を教えてください。

4

1 に答える 1

0

jQueryモバイルタップイベントが正しく呼び出されていると仮定します。ブラウザが実際に要素に表示するのに時間がかかるという問題のように聞こえます。

'display:none'がレンダリングツリーに含まれていないため、ブロックするように変更すると、ブラウザがこれを行うのに時間がかかる場合があります。

一部のソリューションでは、要素を「不透明度:0」に設定し、「不透明度:1」に設定しています(代替は可視性プロパティです)。これを行うと、要素がレイアウトに影響を与えることを意味しますが、固定位置を使用しているため、これは問題にはなりません。

于 2013-03-20T14:49:14.287 に答える