ネットワーク
- jQuery クリックしたら文字が変わる
- マウスを画像に乗せたらスライドショーのtimerIdを止める $("#big-image-content").mouseover(function(){clearInterval(timerId);});
- ボタンクリックでボタンの文字の表示を切り替える(1)
- ボタンクリックでボタンの文字の表示を切り替える(2)
- 変数とは
このページ、内容に自信なし、あんまり理解しないで作成しています。適当なところがあります。あんまり参考になりません。その上で役立ったら嬉しいです。
上の本で中央の赤表紙の本、基礎を勉強するならこの本が一番参考になるかも、一見とっつきにくい感じがします。しかし読み解いていくうちに基本的な事に関してじっくり解説してあります。その分、他の本にありがちな、見た目に興味を引きそうな派手なプログラミングの勉強というのがありません。徹底して基礎を勉強できるように書いてあります。
正直言って、なんのプログラミングでも同じですが、すぐに壁にぶちあたりますね。本に書いてある事について実行するぶんは問題ないでしょう。しかし、自分で考えてプログラミングするとなるとそこで挫折してしまいます。やはり基本ができていないからでしょうね。
私も悩みながら、これを書いています。はたして壁をぶち抜くことが出来るのか……?
上の本で中央の赤表紙の本、基礎を勉強するならこの本が一番参考になるかも、一見とっつきにくい感じがします。しかし読み解いていくうちに基本的な事に関してじっくり解説してあります。その分、他の本にありがちな、見た目に興味を引きそうな派手なプログラミングの勉強というのがありません。徹底して基礎を勉強できるように書いてあります。
正直言って、なんのプログラミングでも同じですが、すぐに壁にぶちあたりますね。本に書いてある事について実行するぶんは問題ないでしょう。しかし、自分で考えてプログラミングするとなるとそこで挫折してしまいます。やはり基本ができていないからでしょうね。
私も悩みながら、これを書いています。はたして壁をぶち抜くことが出来るのか……?
Chapter3:HTML要素の指定とCSSプロパティの操作
要素の指定
CSSプロパティの操作
Chapter4:要素の操作(div等のhtml要素)
Chapter5:属性の操作(のsrcが属性、imgに属するという意味?)
Chapter6:イベント処理
Chapter7:繰り返しと検索/抽出
Chapter8:アニメーションの演出
Chapter9:アニメーションの実際
Chapter10:jQuery UIの基本とマウスによる要素の操作
Chapter11:要素の並び替えとドラッグ&ドロップ
Chapter12:jQuery UIによる画面コンポーネント(1)
Chapter13:jQuery UIによる画面コンポーネント(2)
Chapter14:Ajaxアプリケーションの構築
Chapter15:jQuery によるAjaxプログラミング
jQueryはサーバーが無くても、インターネットに接続してなくても動作する。Ajaxはその2つが必要
http://jquery.comからダウンロード
Google AJAX APIを使ってjQueryを読み込む方法
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
jQueryで作るAjaxアプリケーション:サポートページ
http://gihyo.jp/book/2008/978-4-7741-3490-1/support(ここには何も無い、あるのは最後のミニブログのデータのみ)
http://jquery.comからダウンロード
Google AJAX APIを使ってjQueryを読み込む方法
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js"></script>
jQueryで作るAjaxアプリケーション:サポートページ
http://gihyo.jp/book/2008/978-4-7741-3490-1/support(ここには何も無い、あるのは最後のミニブログのデータのみ)
RapidWEaverのテーマによって動作しない場合がある。
コードの表示の仕方も変わる
コードの表示の仕方も変わる
ブラウザを調べることが出来るjQuery
動作サンプル
jQuery(CSSプロパティのいろいろ)
$はjQueryと同じ意味になる
$(要素).css('プロパティ名','値');
※1つだけのcssプロパティを設定
$(要素).css({'プロパティ名1','値1','プロパティ名2','値2'});
※複数のcssプロパティを一度に設定できる
$(要素).width(値);
※特定のcssだけを設定する、値を100とした場合は100px。その他の場合は'90%'や'20em'と指定してやる。
※下のスクリプトでは()の区切りがわかりにくいが赤のところを見ると理解しやすい。
$('div.pasnel').click(function(){$(this).clone(true).appendTo('div#content');}) ;
ポイント
- クリックすると、文字を変更できる。 chapter5>5-1 属性の追加
- $("p a")
- $("#name")
- $("#addr1, #addr2")
- $("a[href$='pdf']")
- 1つ目は、p要素の中にあるa要素(リンク)を全て選択します。
- 2つ目は、id属性がnameの要素を選択します。
- 3つ目は、id属性がaddr1という要素とaddr2という要素を選択します。(カンマ区切りで複数選択しています)
- 4つ目は、リンク先がpdfで終わるa要素を全て選択しています。
- CSSは1つ設定する場合と2つ以上つなげて設定する場合では記述のしかたが違う049p参照