Jquery 单击时再次更改Div宽度

我有一个固定的标题和一个隐藏的垂直菜单

当有人单击按钮时，菜单出现，固定标题宽度从100%更改为82%

但是当我关闭菜单时，我的标题不再将值更改为100%，当再次单击按钮时，如何更改宽度值

CSS

JQuery

<script>
$(window).load(function() {

$("#hide").click(function(){

   $("#menu").fadeToggle();
   $("#header").css({"width":"82%","left":"18%"});


});
});
</script>

$（窗口）。加载（函数（）{
$（“#隐藏”）。单击（函数（）{
$（“#菜单”）.fadeToggle（）；
$（“#header”）.css（{“width”：“82%”，“left”：“18%”）；
});
});

谢谢

试试这个：

$("#hide").click(function(){

  $("#menu").fadeToggle();
  $('#header').toggle(function () {
    $("#header").css({"width":"82%","left":"18%"});
  }, function () {
    $("#header").css({"width":"100%","left":"18%"});
  });

});

如果您使用的是jQuery 2.*，则可以执行以下操作：

$("#hide").click(function(){

  $("#menu").fadeToggle();
  $('#header').toggleClass("active");

});

只需确保

.active

如下所示：

.active{
  width:82%;
  left:18%;
}

---

请在JSFIDLE上添加您的代码，我们可以对其进行修改。请注意，

.toggle（）

事件可能重复，自版本1起已被删除。感谢@Felix，如果他们使用的是2，则添加了另一个选项*

.active{
  width:82%;
  left:18%;
}