0

vbulletin スキン用に展開/折りたたみ可能なサイドバーを作成しようとしています。私のコードは次のとおりです。

<script>
    jQuery(document).ready(function () {
        $(".hide").click(function () {
            $("#sidebar").animate({ width: "0px", opacity: 0 }, 500);
            $("#sidebar").animate({ padding: "0" }, 500);
            $("#sidebar").css("margin", "0");
            $("#sidebar").hide;
        });

        $(".show").click(function () {
            $("#sidebar").animate({ width: "150px", opactiy: 100 }, 500);
        });
    });
</script>


<!--Sidebar Start-->
<table width="$stylevar[outertablewidth]" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>

        <td width="150" valign="top" class="page" id="sidebar" style="padding: $stylevar[cellpadding]px;">
            <a class="hide" href=#>YOUR CONTENT HERE</a>
            <a class="show" href=#>YOUR CONTENT HERE</a>
        </td>

</table>
<!--SideBar End -->

サイドバーを完全に折りたたんでほしいので、なかったようです。

また、テーブルを使用するのは良くないことも知っていますが、vbulletin を使用するのが最も簡単な方法です。ああ、.hide と .show をサイドバーの外に、おそらくその左側に移動する予定です。

最後に、ここで私が行った ことを確認できます。助けてくれる人に感謝します。

4

1 に答える 1

0

とを定義するextslide プラグインを見てみましょう。プラグインを使用するか、ソースを参照してその方法を確認すると役立つ場合があります。slideLeftHide()slideLeftShow()

edit : 以下と同等のことをしているように見えます:

$(".hide").click(function(){
  $("#sidebar").animate({width:"hide", opacity:0}, 500 );
});

と

$(".show").click(function(){
  $("#sidebar").animate({width:"show", opacity:100}, 500 );
});
于 2009-08-24T09:40:04.590 に答える