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

質問

とあるサイトを参考にアコーディオンメニューを作成しています。
おおよその動作はうまくいっているのですが、1点どうしても実装できません。

例えば、menu2.htmlへ遷移した場合は、<ul class="menu2">内のメニューは
閉じることなく開いたままにしておきたいのです。他のページへ遷移した場合も同様です。

該当ページへ遷移した時に該当メニューのクラス名を変えること(open→block)で読み込み時は開いたままになるようになりましたが、他のメニューをクリックすると該当ページメニューも閉じてしまいます。

メニュー部分を開いたまま保てる方法をどなたかご教授いただけませんでしょうか。
何卒よろしくお願いいたします。

---------------------------------------
html

<ul class="acc">
<li>
<h3 class="h3_menu1 open"><a href="#">Menu1</a></h3>
<ul class="menu1">
<li class="menu1_1"><a href="menu1_1.html">Menu1_1</a></li>
<li class="menu1_1"><a href="menu1_2.html">Menu1_2</a></li>
<li class="menu1_1"><a href="menu1_3.html">Menu1_3</a></li>
<li class="menu1_1"><a href="menu1_4.html">Menu1_4</a></li>
<li class="menu1_1"><a href="menu1_5.html">Menu1_5</a></li>
</ul>
</li>

<li>
<h3 class="h3_menu2 block"><a href="#">Menu2</a></h3>
<ul class="menu2">
<li class="menu2_1"><a href="menu2.html#Menu3_1">Menu2_1</a></li>
<li class="menu2_2"><a href="menu2.html#Menu3_2">Menu2_2</a></li>
<li class="menu2_3"><a href="menu2.html#Menu3_3">Menu2_3</a></li>
<li class="menu2_4"><a href="menu2.html#Menu3_4">Menu2_4</a></li>
<li class="menu2_5"><a href="menu2.html#Menu3_5">Menu2_5</a></li>
</ul>
</li>

<li>
<h3 class="h3_menu3 open"><a href="#">Menu3</a></h3>
<ul class="menu3">
<li class="menu3_1"><a href="menu3.html#Menu3_1">Menu3_1</a></li>
<li class="menu3_2"><a href="menu3.html#Menu3_2">Menu3_2</a></li>
<li class="menu3_3"><a href="menu3.html#Menu3_3">Menu3_3</a></li>
<li class="menu3_4"><a href="menu3.html#Menu3_4">Menu3_4</a></li>
</ul>
</li>
</ul>

jQuery

var $j = jQuery;

$j(function(){

$j(".acc").each(function(){
$j("h3.open", this).each(function(index){
var $this = $j(this);
if(index > 0) {
$j("h3.open").next().hide();
} else {
$j(".menu1").hide();
}

$this.click(function(){
var params = {height:"toggle", opacity:"toggle"};
$j(this).next().animate(params).parent().siblings()
.children("ul:visible").animate(params,{complete: function(){$j("h3.block").css("display","block");}});

return false;
});
});
});
});

回答No.2

fujillin · ベストアンサー

#1です。

＞animateのなめらかな表示非表示は維持させてたいです。
animateでも、slideでも同じはずですが・・・？
（確認はしていませんが、結局同じ処理にいっているはずと思います）

そういえば、こんなのもありましたね。
　http://okwave.jp/qa/q7361644.html

まぁ、内容的にanimateで定義なさりたい場合は、slideの部分を入替えればすむはずです。
animateに代えても同じみたいですが、速度を早くすれば目立たなくなるかと。
あるいは、メニュー自体をabsoluteで表示したり、easingを指定してごまかす（？）とか…

#1では無駄な部分があったので…
$(function(){
　var params = {height:"toggle", opacity:"toggle"};
　$(".acc h3.open").click(function(){
　　$(this).next().animate(params, 200).parent().siblings().find("h3.open").next(":visible").animate(params, 200);
　}).next().hide();
});

回答No.1

fujillin

コードを見てもいまひとつ意図がよく理解できないのですが、

classにopenの指定があるものだけ動作して、ないものは動作しないという解釈でよいのでしょうか？
（ないものをクリックした特は、他に何も処理しないということでよいのかなぁ）

よくわからないけれど、こんなのでもよいのだろうか？
（全角空白は半角に）
var $j = jQuery;

$j(function(){
　$j(".acc").each(function(){
　　$j("h3.open", this).next().hide().end().click(function(){
　　　$j(this).next().slideToggle().parent()
　　　　.siblings().find("h3.open").next().slideUp();
　　});
　});
});

補足

fujillin様

ご回答いただきありがとうございます。
説明が足りずに申し訳ありません。
おっしゃる通りでclassがopenのものはアコーディオンメニューが適用されて
class名がblockのものには適用せず、表示を固定したいです。

いただきましたサンプルで試したところ表示・非表示自体は思い通りの動きだったのですが
animateがないことでカクカクした動きになってしまいましたのでできればanimateのなめらかな表示非表示は維持させてたいです。

もし他に解決策があれば、ご教授いただけませんでしょうか。
引き続きよろしくお願い致します。