jQueryでどんなことが出来るのか？
どんなプラグインがあるのか、
より深く理解するためにこの本で勉強しました。
一通りJavaScriptやjQueryを勉強した人が読むための本。
全くの初心者にはおすすめ出来ない。
jQueryでどんなことが出来るのかを調べられる辞書に近い本。
自分では気がつかないような面白そうな表現をページをめくって調べるのに使える。
この本を使っていなかったから出会わなかったであろう、
プラグインなどがたくさんあり、勉強になりました。
本で紹介されている一つ一つの機能を自分で作り直してみるのも良いかもしれません。
本の目次
目次を紹介しておく。
300ページくらいあり、結構充実している。
<目次>
INTRODUCTION jQueryの基本
01 jQueryの導入
02 jQueryの基本構文とセレクタ
03 メソッドとイベント処理
CHAPTER 1 ナビゲーション
01 細かなCSS設定なしに画像をロールオーバーさせる
02 画像のロールオーバーにアニメーションを付ける
03 細かなCSS設定なしに円形メニューを作る
04 jQuery UIを使ったアコーディオン
05 jQuery UIを使った順番を入れ替えられるアコーディオン
06 アニメーションで切り替わるタブ
07 グローバルナビゲーションをウィンドウ上部に固定する
08 特定の要素を固定表示させる
09 スクロールするとフェードインで現れる「戻る」ボタン
10 スクロールすると下から出現する「戻る」ボタン
11 折りたたみアニメーションが付いたパンくずリスト
CHAPTER 2 インターフェース
01 自動的にメールアドレスにリンクを付ける
02 リンクの内容に合わせてアイコン画像を挿入する
03 ブロック要素全体にリンクを設定する
04 文章中のhttp://から始まるURLに自動でリンクを付ける
05 外部リンクを自動的に別ウインドウで開く
06 リスト要素を自動分割する
07 リストをツリー表示型のメニューに変更する
08 画面をクリックした時にほわっとした輪っかのアニメーションを表示する
09 テキストや画像などをぶるぶるさせるアニメーションを実装する
10 アニメーションするテキストシャドウ
11 アニメーションしながら交互にスタイルを切り替える
12 文字が流れるニュースティッカー
13 ページ内の文字サイズを変更できるボタンを設置する
14 ウインドウサイズに合わせて文字の大きさを変化させる
15 ドラッグ&ドロップで要素の順番を入れ替える
16 ドラッグ&ドロップで要素を移動できるようにする
17 ドラッグで移動できる範囲を制限する
18 要素がドロップされたことを判定する
19 ドラッグしてサイズを変更できるボックスを作成する
20 シンプルなダイアログボックス
21 jQuery UIを使用したダイアログボックス
22 jQuery UIを使用した要素を追加するダイアログフォーム
23 スリムなモーダルウインドウ ..などなど
CHAPTER 3 フォト&ムービー
01 オープニングを豪華にするイントロエフェクト
02 Lightbox風のシンプルフォトギャラリー
03 シンプルに作れるスライドショー
04 本をめくるような演出のギャラリー
05 ランダムに表示されるポラロイド風ギャラリー
06 立体感のあるスライドギャラリー
07 マウスホイールで動くスライドギャラリー
08 シンプル設定のカルーセル
09 スクロールに合わせて画像の表示を開始するエフェクト
10 ページ送りを自動で生成するギャラリー ..などなど
CHAPTER 4 レイアウト
01 ウィンドウの大きさに合わせてレイアウトが変更されるボックス
02 要素のボックスの高さを揃える
03 ドラッグで自由に再配置できるボックス
04 左右に隠れているボックスを表示する
05 文字色を簡単に変化させるプラグイン ..などなど
CHAPTER 5 ソーシャル
01 複数のSNSの投稿を一覧表示する
02 各SNSの「いいね!」ボタンを設置する
03 Twitterのつぶやきを横スライドしながら見せる
04 Google+の投稿を自動取得してウィジェットとして表示する
05 Instagramの写真を埋め込む
06 Google Static Mapsをズーム可能にする ..などなど
CHAPTER 6 モバイル
01 スマートフォンやタブレットにも対応したギャラリー
02 レスポンシブデザインに対応したグリッドを表示する
03 ウィンドウサイズに合わせて調整されるパンくずリスト
04 自動的に段数が変わるカラムレイアウト
05 ウインドウサイズに合わせてテーブル内の表示を変更する
06 jQuery Mobileを使って簡単にスマートフォンサイトを作成する
以上です。
興味を持った方はやってみて下さい。
コメントを残す