96's blog

WEBサイト制作科 6ヶ月コース

jQuery

jQuery11(jQuery filteringの習作)

これぐらい動かす要素があると重い。やはり画像を見せるもの。 firefoxが特に重い。

jQuery10(jQuery Filtering)

jQuery Filtering ブログ・Webデザインの勉強 | 風姿花伝「jQueryでフィルタ(フィルタリング)機能」 お手本サイト 補足 内容が多い・少ないによって縦スクロールバー分の表示ズレがある場合はhtml{overflow-y: scroll;}で固定。 画像サイズを変える場合は…

jQuery09(Beautiful Background Imageの習作)

jQuery08(複数の画像を効果的にみせるjQuery2つ)

Beautiful Background Image Navigation 例:お手本 画像のスライド mootoolsのimage menuというスクリプトを使う。 例:街をつくる建築作法 その他 jQueryをいろいろ使うと、対応バージョンの違いからかちあって動かなくなることがあるので注意。 HTMLでid…

jQuery07(カルーセルパネル)

jQuery Tools SCROLLABLE standalone demoのソースを利用。 Fire Foxは背景画像を保存できる。

jQuery06(タブパネル)

Webデザイン初心者の勉強「タブパネル(3) jQueryUI」 jQuery UI jQuery user interface jQuery TOOLS jQuery TOOLS PhotoShopで色相・彩度を変えてカスタマイズ。 作成例 Zen Coding コーディングをショートハンドで記述して作業効率を高める拡張機能。 イン…

jQuery05(タブパネル)

テキストP200。 HTML <divid="container"> <ulclass="tab"> <li><ahref="#tab1"class="selected">JavaScript</a></li> <li><ahref="#tab2">CSS</a></li> <li><ahref="#tab3">HTML</a></li> <li><ahref="#tab4">jQuery</a></li> <li><ahref="#tab5">XHTML</a></li> </ul> <ulclass="panel"> <liid="tab1"> Lorem ipsum dolor sit …</liid="tab1"></ulclass="panel">

jQuery04

マウス操作 a要素 return:false; ブラウザ 選択時の背景反転 ::selection{background:#○○○;} toggle アニメーション アコーディオン 参考サイト:街をつくる建築作法

jQuery03

表示・非表示を切り替える hide()メソッド show()メソッド fadeOut()メソッド fadeIn()メソッド fadeTo()メソッド 1000=1秒。 show、fadeInは対象をdisplay;none;で消しておく。 fadeToは不透明度が0になっただけで対象は消えていないので、他の要素の位置…

jQuery02

jQueryを利用すると、JavaScriptより少ない記述で済む。 head内でscript srcをGoogle Ajax API CDNに指定する。 minはソース内の改行コードを省いて軽量化したもの。 DreamWeaverでjQuery用のローカルサーバー設定 セレクタ body内の1番下に記述。 $(functi…

jQuery01

参考サイト:40分で覚える!jQuery速習講座 JQueryは、JavaScriptの一種。 ダウンロードして使うもよし。 外部サイトにあるものを参照してもよし。 今回はGoogle AJAX Libraries APIから参照。 CDN(ontents Delivery Network) バージョンは1.9.1を使う。 …