jQuery アコーディオンメニューについて

質問

jQuery アコーディオンメニューについていくつか質問させていただきます。

当方、はじめてjQueryを使っています。

以下のページを参考にアコーディオンメニューを作成しています。

http://triplexxx.jp/archives/150

<ul class="acc">
<li><a href="1" class="open">category1</a>
<ul>
<li><a href="#">menu 1-1</a></li>
<li><a href="#">menu 1-2</a></li>
<li><a href="#">menu 1-3</a>
<ul class="fxmn">
　　　　 <li><a href="#>menu1-3-1</a></li>
<li><a href="#">menu1-3-2</a></li>
<li><a href="#">menu1-3-3</a></li>
</ul>
</li>
　</ul>
</li>
<li><a href="2" class="open">category2</a>
<ul>
<li><a href="#">menu 2-1</a></li>
<li><a href="#">menu 2-2</a></li>
<li><a href="#">menu 2-3</a></li>
</ul>
</li>
<li><a href="3" class="open">category3</a>
<ul>
<li><a href="#">menu 3-1</a></li>
<li><a href="#">menu 3-2</a></li>
<li><a href="#">menu 3-3</a></li>
<li><a href="#">menu 3-4</a></li>
</ul>
</li>
</ul>

var $j = jQuery;
$j(function(){
$j(".acc").each(function(){
$j("a.open", this).each(function(index){
var $this = $j(this);
if(index !=n) $this.next().hide();
$this.click(function(){
var params = {height:"toggle",opacity:"toggle"};
$j(this).next().animate(params).parent().siblings()
.children("ul:visible").animate(params);
return false;
});
});
});
});

(1)：具体的にあげますと、上記のmenu1-3をクリックしてmenu1-3-1、1-3-2、1-3-3のアコーディオン　　を開き、
　　1-3-1をクリックしてリンク先に飛んだ際に、直前に開いていたアコーディオンをそのままの状態　　　にしておきたいというものです。

（↓こんな感じです）
category1
・　menu 1-1
・　menu 1-2
・　menu 1-3
・・　menu1-3-1
・・　menu1-3-2
・・　menu1-3-3
category2
category3

教えて！gooの過去の質問を参考させていただきながら、

if(index !=n) $this.next().hide();　　

で、　n　を指定することで、それぞれのサブメニューを開いた状態にすることには成功したのですが、その下の階層のメニューをどのように指定すればよいかがわかりません。

(2)：また、リンク先のページに飛んだ時に、アコーディオン部分は動かないのが望ましいのですが、
　　可能でしょうか？
　　（タブのようにページが切り替わる感じが理想的ですが、ページ数が大変多いため難しいとおもっ　　ています）

(3)：(1)、(2)はページごとにscriptを書き換えるのではなく、htmlをいじることで（li タグにclass指定をす　　　るなど）変更するのは可能でしょうか？

　　外部scriptが使えればと思っています。

複数の質問になりましたが、どうぞよろしくお願いいたします。

回答No.1

kosukejlampnet

http://jqueryui.com/demos/accordion/

こちらにｊQuery公式のプラグインがあります。オフィシャルなんでドキュメントもしっかりしているし、オプションも用意されているんで、便利かと思いますよ。