3

データを表示し、スワイプジェスチャを模倣するためにhtml5 Webアプリを作成し、Wipetouchと呼ばれるJqueryプラグインを使用しました。ワイプジェスチャがトリガーされると、JavaScript関数を使用して、すべてのデータを新しい番号で再描画するだけです。画像は静的であり、現在、スワイプするたびに読み込まれているため、これは最適なソリューションではないことに気付きました。どんなアイデアでも素晴らしいでしょう。

編集

var img01 = new Image();
enter code here
img01.onload = function () {
    ctx.drawImage(img01, x, y, img01.width * 2, img01.height * 2);
    ctx.fillStyle = "white";
    //draw text
    ctx.font = "bold 28pt Calibri";
    ctx.fillText(monthname[date.getMonth()], x+51, y+135);
    ctx.fillText(d[1], x+47, y+37);
}
img01.src = 'images/retail_car.png';

これを先に明らかにしなかったことをお詫びします。キャンバスに画像を描画しています。このコードは、wipetouchプラグインがスワイプを登録するたびにトリガーされます。すべてをキャンバスに残したいので、前述のCSS修正は私の場合は機能しません。

4

1 に答える 1

1

画像をhtmlに入れて、display：none;を持つcssのクラスを与えることができます。次に、関数を呼び出すときに、表示された画像のクラスをdisplay：block;を使用したものに変更できます。または、それらを表示する必要があります。スワイプした後、必ずクラスを元に戻して、新しい画像が表示され、古い画像が表示されないようにしてください。そうすれば、スワイプを呼び出すたびにそれらが再度生成されることはありません。

于 2012-04-04T17:24:47.720 に答える