jQueryでの開閉式のアコーディオンの動きいろいろ
- Category ：
- Javascript
クリックをすると開閉するようなメニューやコンテンツってよく見かけたりしますし、実際に使いたいってクライアントもけっこう多いですしね。
開閉時の動きについても実際いろいろとあるわけなんですが、今回はjQueryで出来る一番基礎的な事を紹介しておきたいと思います。
…ここからが続き
デモページの解説
動きの違いはJavascriptの最後の方に記述されている「$(this).next()」の次に指定する要素を変更しているだけです。
「.slideToggle("slow");」の()内には「slowやfast」以外にも数字で指定も出来ますよ。
使い方はjQueryとデモページで記述されているスクリプトをheadタグ内にでも読み込ませて下さい。
- 開閉式のアコーディンの動き 1 ダウンロード（5KB）
- 開閉式のアコーディンの動き 2 ダウンロード（5KB）
- 開閉式のアコーディンの動き 2 ダウンロード（5KB）
Comments
Cocoさん。
IE6でも使用は可能になっております。
こちらのスクリプトはIE6でも使用出来ますでしょうか？
よろしくお願い致します。
この記事で紹介しておりますアコーディオンは基本的なものであり、二階層にわかってアコーディオンをする仕組みになっておりません…
自分の方でいくつかスプリクトを書き換えてみたのですが、IEで上手く動作しなかった為、こちらは後日調べて、新規の記事にて紹介したいと思います。
はじめまして。質問があり投稿しました。
筆者さまが書かれたJSでアコーディオンを作成しましたが、第2階層にリンクするとアコーディオンが閉じてしまいます。これはどこを修正すれば、開いたままになるでしょうか？
お忙しいところ恐れ入りますが、ご教授いただけますでしょうか。よろしくお願いいたします。