1
JavaScriptを使用してキャンバスコンテキストを作成し、CSSクラスの定義で参照されるキャレット（^）の単純なイメージを描画する単純なHTML5 Webアプリケーションがありますイメージを複数のタグにレンダリングします。HTML5 IOS WebAppキャンバスがホームスクリーンから起動されたときレンダリングされない
アプリケーションがブラウザで正常に表示されます。Google Chromeの（win7の）、モバイルサファリ（iPadのiOS4を& IOS5は、iPod（iOS4を& IOS5）を試してみました しかし、iPadやiPodの場合、私は、 "ホームスクリーンに追加" と
Safariで表示されているのとは対照的に、ホームスクリーンから起動したときにHTML5がレンダリングされる方法に違いがあることは知っていますが、検索で何も表示されませんこれはうまくいかないことを示しています。
誰かが私にとってこの問題を明らかにすることができたら、私は感謝します。
以下のコードサンプル：
**(index.html)**
<html>
<head>
<link rel="stylesheet" href="styles/main.css" >
<script src="scripts/main.js"></script>
</head>
<body>
<div class="scoreboard-item-wrapper">
<div class="scoreboard-item">
<div class="box" ><button id="btn_homegoalup" class="up" onclick="incAction(true,true)"></button>
</div>
</div>
</div>
</body>
</html>
**(main.js)**
initChevronUp("chevron-up", "hsl(228, 1%, 50%)");
function initChevronUp(id, style) {
var context = document.getCSSCanvasContext("2d", id, 22, 13);
context.save();
context.translate(4,0);
context.clearRect(0, 0, 20, 13);
context.strokeStyle = style;
context.lineWidth = 3;
context.beginPath();
context.moveTo(1, 9);
context.lineTo(6.5, 1);
context.lineTo(12, 9);
context.stroke();
context.restore();
}
**(main.css)**
.scoreboard-item .box button.up{
background:
-webkit-gradient(linear,left top, left bottom,
from(rgba(255, 255, 255, .25)), to(transparent)),
-webkit-canvas(chevron-up) center center no-repeat transparent;
}