試験公開中

このエントリーをはてなブックマークに追加

Google API Expertが解説する HTML5逆引きリファレンス

インプレス

2,191円+税

125個にも上るHTML5の各種コーディング手法を紹介。さまざまな頻出・重要テクニックを満載した"使える"HTML5逆引き本です。サンプルは、5つのPCブラウザと2種類のスマートフォンブラウザで動作テスト。各種ブラウザでの挙動についても説明。さらには、対応ブラウザと未対応ブラウザの判定方法のほか、未対応の場合の対処法も解説します。

サポートサイト

出版社による関連ページが公開されています。

書誌情報

  • 著者: 古籏 一浩
  • 発行日:
  • 最終更新日: 2012-04-17
  • バージョン: 1.0.0
  • ページ数: 352ページ(A4PDF版換算)
  • 対応フォーマット: PDF
  • 出版社: インプレス

対象読者

●HTML5 APIを使用しているか、使用しようと考えている ●HTML5の知識があり、すでに使用している ●CSSの知識がある(レベル3の知識は不要) ●JavaScriptの中級者以上

著者について

古籏 一浩

主にJavaScript 関係の書籍を執筆。最近はHTML5 関係の書籍も。サイトには逆引きGoogle Maps API ver 3リファレンスなども用意してあるのでご利用下さい。

Web : http://www.openspc2.org/

目次

序章 HTML5 APIの概要

  • 0-01 HTML5 APIの全容を把握する
  • 0-02 本書の読み方

第1章 Geolocation

  • 1-01 Geolocation APIが使用できるかどうか調べる
  • 1-02 一回だけ現在位置を取得する
  • 1-03 定期的に現在位置を取得する
  • 1-04 位置情報の取得を停止する
  • 1-05 位置情報の取得方法をより細かく設定する

第2章 Audio

  • 2-01 スクリプトでHTML5 Audioが使えるか調べる
  • 2-02 オーディオを再生する
  • 2-03 オーディオを停止する/再生開始時間を指定する
  • 2-04 オーディオを繰り返し再生する
  • 2-05 コントロールバーを表示/非表示にする
  • 2-06 自動的に再生する
  • 2-07 指定したURL のオーディオを演奏する
  • 2-08 特定の形式のオーディオが再生できるか調べる
  • 2-09 再生時間を設定/取得する
  • 2-10 再生速度を指定する
  • 2-11 オーディオの情報(種類や長さ)を取得する
  • 2-12 音量を調整する

第3章 Video

  • 3-01 スクリプトでHTML5 Videoが使えるか調べる
  • 3-02 映像を再生/停止、制御する
  • 3-03 映像を繰り返し再生する
  • 3-04 コントロールバーを表示/非表示する
  • 3-05 自動的に再生する
  • 3-06 全画面で再生する
  • 3-07 特定の形式のビデオが再生できるか調べる
  • 3-08 再生前に表示する画像(ポスターフレーム)を指定する
  • 3-09 再生時間を設定/取得する
  • 3-10 再生速度を指定する
  • 3-11 ビデオの情報(種類や長さ)を取得する
  • 3-12 音量を調整する

第4章 Web Workers

  • 4-01 Web Workersが使えるか調べる
  • 4-02 ワーカーを作成/破棄する
  • 4-03 ワーカー側で処理を終了させる
  • 4-04 ワーカーのエラーを捕捉する

第5章 Canvas

  • 5-01 Canvasを表示する
  • 5-02 スクリプトでCanvas が使えるか調べる
  • 5-03 Canvasをブラウザ画面全体に表示する
  • 5-04 コンテキストを取得する
  • 5-05 PNG/JPEG形式に変換する
  • 5-06 パスを作成する
  • 5-07 指定座標に移動させる
  • 5-08 直線を描画する
  • 5-09 曲線を描画する(3次ベジエ曲線、2次ベジエ曲線)
  • 5-10 円、円弧を描画する
  • 5-11 四角形を描画する
  • 5-12 角丸四角形を描画する
  • 5-13 塗りつぶしの色を指定する
  • 5-14 線の色を指定する
  • 5-15 クリッピング範囲を設定する
  • 5-16 指定座標がパス内かどうか調べる
  • 5-17 グラデーションを描く
  • 5-18 パターンを描画する
  • 5-19 Canvasの状態を保存、復元する
  • 5-20 拡大縮小(スケーリング)する
  • 5-21 回転する
  • 5-22 基準位置を移動させる
  • 5-23 変形させる
  • 5-24 新規にピクセルイメージを作成する
  • 5-25 Canvas内のイメージを取得する
  • 5-26 加工したイメージをCanvasに描画する
  • 5-27 画像を描画する
  • 5-28 文字を描画する
  • 5-29 行揃えを指定して文字を描画する
  • 5-30 筆記方向を指定する
  • 5-31 文字の描画幅を取得する
  • 5-32 不透明度を指定する
  • 5-33 描画モードを指定する
  • 5-34 線のスタイルを指定する
  • 5-35 影の位置やぼかし具合を指定する

第6章 Drag&Drop

  • 6-01 ドラッグできるようにする
  • 6-02 ドロップできるようにする
  • 6-03 ドラッグ中の画像を設定する

第7章 File

  • 7-01 スクリプトでFile APIが使えるか調べる
  • 7-02 選択されたファイル数と種類などを調べる
  • 7-03 テキストファイルの内容を読み出す
  • 7-04 バイナリファイルの内容を読み出す
  • 7-05 ファイルの読み込みを中止する
  • 7-06 ファイルの読み込みの進捗状況を表示する

第8章 Webストレージ

  • 8-01 Webストレージが使えるか調べる
  • 8-02 Webストレージに保存する
  • 8-03 ストレージに複数のデータを保存する
  • 8-04 ストレージから読み出す
  • 8-05 1つのキーから複数のデータを読み出す
  • 8-06 特定のキーのデータを削除する
  • 8-07 セッションストレージを利用する

第9章 オフラインWebアプリケーション

  • 9-01 ファイルをキャッシュさせる
  • 9-02 キャッシュ/オフライン状態を調べる
  • 9-03 キャッシュを更新する

第10章 Form

  • 10-01 入力項目を必須にする
  • 10-02 入力パターンを設定する
  • 10-03 URLだけを入力できるようにする
  • 10-04 メールアドレスだけを入力できるようにする
  • 10-05 電話番号だけを入力できるようにする
  • 10-06 数値だけを入力できるようにする
  • 10-07 入力値の範囲や間隔を設定する
  • 10-08 入力内容を日付に限定する
  • 10-09 入力内容を月、週単位に限定する
  • 10-10 入力内容を時間に限定する
  • 10-11 日付と時間を同時に指定できるようにする
  • 10-12 スライダーを表示する
  • 10-13 カラーピッカーを表示する
  • 10-14 検索フィールドを表示する
  • 10-15 今日の日付をテキストフィールドに設定する
  • 10-16 スライダーの値が変化したら処理を行う
  • 10-17 スクリプトで内容をチェックしエラーを表示する

第11章 Text Selection

  • 11-01 選択されているかどうか調べる
  • 11-02 選択された文字を取得する
  • 11-03 選択範囲を指定する
  • 11-04 選択範囲を削除する
  • 11-05 選択範囲の情報を取得する
  • 11-06 キャレット(カーソル)の位置を設定する

第12章 Text Editing

  • 12-01 編集可能にする/編集状態を調べる
  • 12-02 編集コマンドをサポートしているか調べる
  • 12-03 編集コマンドを実行する

第13章 Sensor

  • 13-01 加速度センサーの値を取得する
  • 13-02 ジャイロセンサーの値を取得する
  • 13-03 タッチイベントを捕捉する
  • 13-04 ジェスチャーイベントを捕捉する
  • 13-05 回転イベントを取得する
  • 13-06 同時タッチ数/タッチ座標を取得する

第14章 複数APIの組み合せ

  • 14-01 現在地をGoogleマップ上に表示する
  • 14-02 Canvasに映像の1フレームを表示する
  • 14-03 Canvasのテキスト内に映像を表示する
  • 14-04 Canvas内の画像を加工する
  • 14-05 デスクトップ上にある画像ファイルをドロップしCanvasに描画する
  • 14-06 ワーカーを使って複数のテキストファイル内の文字を同時に検索する

付表:HTML5 関連API Property & Method一覧

Home 書籍一覧 Google API Expertが解説する HTML5逆引きリファレンス ▲ ページトップへ戻る