Справка Jquery, создание разборной боковой панели для форума vbulletin

Question

Я пытаюсь сделать боковую панель для моей вбулетиновой кожи, которая бы расширялась / складывалась. Вот мой код:

    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 );
     });

     });




<!--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>


<!--SideBar End -->

Я хочу, чтобы боковая панель полностью свернулась, и, похоже, ее там не было.

Также я знаю, что использование таблиц не здорово, но это самый простой способ сделать это с помощью vbulletin. О, и я планирую переместить .hide и .show из боковой панели, как только это будет сделано, вероятно, слева от него.

Последнее, вы можете посмотреть, что я сделал Здесь Спасибо всем, кто может помочь.

Answer 1

Я бы взглянул на extslide плагин , который определяет slideLeftHide() и slideLeftShow(). Может быть полезно либо использовать плагин, либо просто просмотреть источник, чтобы увидеть, как они это делают.

edit : они выглядят эквивалентно следующему:

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

и

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