!!!jQuery の基本的なこと オフィシャル http://jquery.com/ ノンプログラマーのためのjQuery入門 http://kachibito.net/web-design/jquery-slide-for-beginner.html 日本語リファレンス http://semooh.jp/jquery/ 入門的なサイト http://ascii.jp/elem/000/000/498/498710/ !!!基本 $(セレクタ).メソッド(引数); 例 $("div").css("color","red"); とか。 !!セレクタ $("#hoge") //IDセレクタ $(".huga") // class セレクタ $("*") // 全称セレクタ $("a img") //子孫セレクタ $("p, div.huga") //グループ化 !!$ $ は jQuery のエイリアス $("div").css("color","red"); は jQuery("div").css("color","red"); と同じ。 あとは、色んなサンプルみて学ぶ !!!リストのソートとか !!テーブルのヘッダ固定とソート http://goomino.blog9.fc2.com/blog-entry-12.html jQuery プラグインのTableSorter を使いつつ、ヘッダを固定する方法 !tablesorter.css {{code HTML, th, td { font:12px/1.22 "Osaka", "MS Pゴシック", Arial, sans-serif; *font-size:small; *font:x-small; } #tableheader { position:relative; border:1px solid #999; width:230px; padding-top:17px; } #tablecontent { overflow:auto; height:120px; } #tablesorter { border-spacing:0; } #tablesorter thead tr .header { background-image:url(themes/blue/bg.gif); background-repeat:no-repeat; background-position:center right; cursor:pointer; } #tablesorter thead tr { position:absolute; top:0; left:0; } #tablesorter thead tr th { background-color:#b2d6ff; border-right:1px solid #999; border-bottom:1px solid #999; width:100px; font-weight:normal; } #tablesorter tbody tr td { border-right:1px solid #999; border-bottom:1px solid #ddd; width:100px; } #tablesorter thead tr .headerSortUp { background-image:url(themes/blue/asc.gif); } #tablesorter thead tr .headerSortDown { background-image:url(themes/blue/desc.gif); } #tablesorter thead tr .headerSortDown, #tablesorter thead tr .headerSortUp { background-color: #5998e0; } #tablesorter tbody tr.even td { background-color:#fff; } #tablesorter tbody tr.odd td { background-color:#eee; } #tablesorter tbody tr.over td { background-color:#ffe6b3; } }} !サンプルhtml {{code HTML,
年月 | 沿革 |
---|---|
2009/02 | ん |
2009/01 | わ |
2001/03 | らりるれろ |
2001/02 | やゆよ |
2001/01 | まみむめも |
2000/03 | はひふへほ |
2000/02 | なにぬねの |
2000/01 | たちつてと |
1999/03 | さしすせそ |
1999/02 | かきくけこ |
1999/01 | あいうえお |