JavaScript/HTML/CSS プログラミング入門

AJAX プログラミングに関する話題はこちらにまとめます。主に JavaScrip, DOM, CSS, 各種ライブラリに関する話題です。

うまく整理できず、ちょっと見にくくなっちゃってます。すみません。

HTML5 に関わる話題は 「HTML5 入門」に移動しました。

• 画像とテキストを横にきれいに並べる方法。vertical-align を少し詳しく
• Google Fonts の使い方
  Google Fonts では多数のフォントがダウンロード利用可能です。
• Web サイトで高機能な書式付入力を可能にする TinyMCE の基本的な使い方
  書式付入力を可能とする TinyMCE の基本的な利用方法を説明します。
• CSS で作る簡単なエレガント・ボックス
  CSS を利用して影のついた DIV 要素を作る方法です。ブラウザの対応状況も示します。
• 同一生成元ポリシーと JSONP とは？
  Same Origin Policy と、その制限を越える JSONP について説明します。
• 他のウィンドウからフォームに入力する方法
  ブラウザ上の JavaScript から複数のウィンドウを開いて、それらの間でデータを受け渡す方法を示します。
• Ajax プログラミング入門 - US ZIP コードの解決例
  簡単なコードサンプルを用いて、AJAX とは何か？どのような仕組みなのかを簡単に解説しています。
• JavaScript の文字列の結合を最適化する
  JavaScript で文字列の足し算をする場合、コーディングの仕方によっては処理が非常に遅くなる場合があります。 この資料では配列を用いることで高速に処理可能であることを示します。
• HTML 要素を動的に追加する
  この資料では DOM を使って動的に HTML 要素をドキュメントに追加する例を示します。
• イベント処理の基本
  この資料ではイベントについていくつか用語の解説を行い、最後に複数のブラウザで実行可能なイベント処理ハンドラの書き方を示します。 (といっても、通常は prototype.js や jQuery 等のライブラリを使いますから、これらはあくまで勉強目的ですが)
• mousemove イベント処理例 - 写真の(擬似)拡大
  「画像の拡大鏡」のような動作を実装することを通して、マウスイベント処理について説明します。
• mousemove イベント処理例 - Ajax による小さな改良
  前回の「画像の拡大鏡」の「画像」の読み込み部分を AJAX を組み合わせます。
• 要素のドラッグアンドドロップする方法
  DOM 要素のドラッグアンドドロップを実装するときの仕組みについて説明します。
• スクロールについてくる要素を作る
  ブラウザをスクロールしても常に画面内に表示されるような要素を作る方法について説明します。
• 要素のサイズを測る
  HTML のフロー要素のサイズを測る方法を説明します。
• 角を丸くする方法
  DIV 要素の角を丸くするための方法として、curvyCorners というライブラリを利用する方法を説明します。
• テキストに自動的にリンクを作成する方法
  正規表現をを利用してテキスト中の URL やメールアドレスに自動的にリンクを設定する方法を説明します。
• JavaScript グラフィックライブラリを作る方法
  IE, Firefox 共に動作可能な JavaScript によるグラフィックライブラリを実装しました。
• JavaScript と PHP で画像をクロップ (切り抜き) する方法
  表示されている画像の一部分のみを選択するような動作を実装するにはどうしたらよいでしょうか？JavaScript で画像の一部を選択する動作と、 サーバー側で画像の一部を切り出す方法を組み合わせて、画像のクロップを行う簡単なプログラムを作成します。
• YUI Compressor を使って Script と CSS を最小化する方法
  YUI コンプレッサーで JavaScript と CSS の最小化 (minify) する方法を示します。
• 複数画像を効率よく使用する方法
  Web 上で画像を効率よく利用するための代表的な方法「プリローディング」 と 「ストライピング」 について説明します。
• アニメーションを利用する方法
  scriptaculous を利用してアニメーション効果を実装する方法について、簡単な例を示します。
• JavaScript によるオブジェクト指向プログラミング
  • クラス定義
  • メソッド定義
  • 内部変数 (フィールド) 定義
  • クロージャ
  • オブジェクト種別判断
  • プロトタイプ・チェーン中のオブジェクト確認 isPrototypeOf
  • 組み込みオブジェクトの拡張
  • プロトタイプ継承によるクラスの継承 (Prototypal Inheritance)
  • 関数による継承 (Functional Inheritance)
• JavaScript による一番簡単なスタックとキューの実装方法
  JavaScript を利用してスタックとキューを簡単に実装する方法を示します。
• Enter キーへの応答
  HTML フォームを Enter キーへ応答する方法を示します。
• REST とは？
  REST 方式のサービス・API はもはやスタンダードと言っても過言ではないくらい普通になってます。 そもそも REST って何？と言うことを説明します。

アマゾン・プロダクト・アドバータイジング API (旧: アマゾン Web サービス)

• 電子署名入りのメソッド呼び出し

jQuery

ちなみに、現在 jQuery について資料をまとめ中です。書きかけの jQuery 入門（？）はコチラです。

こちらのページで jQuery 入門として、基本項目と実例を整理しています。(5/15/2011更新)

開発ツール

• 無料で使える JavaScript/CSS の最小化ツール７選 ～ ２００９年１２月版
  無料で使える JavaScript の最小化ツールを７個、集めました。
• 無料で使える Web 開発に必須の Firefox アドオン １３個 ～ ２００９年１１月版
  無料で使える Web 開発に必須の Firefox アドオンリストを作りました。かなりメジャーなものばかりですが、チェックしておいて損はないはずです。