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()

编辑:他们似乎做了以下等价物:

$(".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 回答