Mais conteúdo relacionado
Semelhante a アイコンメモを支えるWeb技術 (20)
アイコンメモを支えるWeb技術
- 20. 文字の描画サンプル
var canvas = document.getElementById('my-canvas');
var context = canvas.getContext('2d');
// 塗りの色
context.fillStyle = '#666666';
// フォント
context.font = "bold 50px 'Arial'";
// テキストの行 え
context.textAlign = 'center';
// テキストのベースライン
context.fillText('Hello World!', 100, 50);
- 39. Webアプリの起動画面
<!-- 640x920 for retina display -->
<link rel="apple-touch-startup-image" media="screen and (device-height: 480px) and (-webkit-min-device-pixel-ratio: 1)"
href="images/Default.png" />
<!-- 640x920 for retina display -->
<link rel="apple-touch-startup-image" media="screen and (device-height: 480px) and (-webkit-min-device-pixel-ratio: 2)"
href="images/Default-2x.png" />
<!-- 640x1136 for retina display (568)-->
<link rel="apple-touch-startup-image" media="screen and (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2)"
href="images/Default-568h-2x.png" />
<!-- iPad Portrait 768x1004 -->
<link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (orientation: portrait) and (-webkit-min-device-
pixel-ratio: 1)" href="images/Default-Portrait-ipad.png" />
<!-- iPad Landscape 1024x748 -->
<link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (orientation: landscape) and (-webkit-min-
device-pixel-ratio: 1)" href="images/Default-Landscape-ipad.png" />
<!-- iPad Portrait 768x1004 -->
<link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (orientation: portrait) and (-webkit-min-device-
pixel-ratio: 2)" href="images/Default-Portrait-2x-ipad.png" />
<!-- iPad Landscape 1024x748 -->
<link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (orientation: landscape) and (-webkit-min-
device-pixel-ratio: 2)" href="images/Default-Landscape-2x-ipad.png" />
かなりググって見つけた成果
- 43. IcoMoon App
Icon Font Generator
選択したシンボルだけをフォントファイ
ルにパックしてくれる。
mobile Safariだけで良いので楽。
http://icomoon.io/app/
- 49. ローカライズ
俺々gettext
var lang = window.navigator.language;
var localizedDictionary = {
"Memo": "メモ",
"Save": "保存",
"Done": "完了",
"Cancel": "キャンセル",
"Input text here.": "ここにメモを入力"
};
var _ = function(str) {
if (lang != "ja-jp") {
! return str;
}
if (str in localizedDictionary) {
! return localizedDictionary[str];
}
return str;
};
使用例!
$('#saveColor').html(_("Save"));
$('#cancelColor').html(_("Cancel"));