さて、前回jQueryとは何かという話しをしましたが、本日は実際にjQueryを使ってみます。何事も実践しないと身につかないですからね。

まず、旧来の方法でアコーディオンっぽいメニューを作ってみました。
サンプル

サンプルでは、3つページを別々に制作し、リンクでページを遷移してメニューを開閉させています。
これでは、ページを遷移する際に読み込む時間がかかりますし、遷移後にページの先頭に画面が移動するなどの問題もあります。そして何より、制作する立場になった時、ページ量がかなり増えてちょっと何かを書き換えるのにも処理が煩雑になってしまいます。

次にjQueryを使用したアコーディオンメニューを作ってみました。
サンプル

今度は、何かなめらかな動きになりましたよね。
こんなflashライクな動きが簡単につけられるのです。いやぁ、もう少し早く勉強すれば良かった(^^ゞ

 


続きを読む