スライドパネルを適切に機能させる方法を理解しようとしています。パネルのスライド部分は問題なく動作していますが、私の問題は次のとおりです。
- パネルはロード時に展開されます。
- 閉じる/開くと想定されるボタン (2 つの異なるボタン) は、クリックされた後に自己非表示になりません。
したがって、基本的に私が達成しようとしているのは次のとおりです。
- ウェブページを開きます。
- 「開く」ボタンをクリック→「開く」ボタンが消える
- 「閉じる」ボタンが出現
- パネルが滑り落ちる。
私が持っているのは:
Web ページを開く -> パネルは既に拡張されています。
「開く」ボタンをクリックします。
何も起こりません。
閉じるボタンは表示されず、パネルはそのままです。これが私のコーディングです:
HTML コード:
<div id="toggle" style="list-style: none;">
<input id="open" class="open" href="#" type="button" value="Open" />
<input id="close" style="display: none;" class="close" href="#" type="button" value="Close" />
</div>
JQuery:
$(document).ready(function() {
$("#open").click(function(){
$("div#panel").slideDown("slow");
});
$("#close").click(function(){
$("div#panel").slideUp("slow");
});
$("#toggle a").click(function () {
$("#toggle a").toggle();
});
});
あらゆる種類の助けをいただければ幸いです。ありがとうございました。