Jquery幻灯片切换。将css重置为默认值

Question

我在按钮上使用切换功能来显示和隐藏包含YouTube视频的div。该视频是一种手语视频，可翻译页面上的内容。

但是，我也使用相同的按钮来减少50％的站点容器div，并删除边距，以便为视频和站点内容留出空间。

这一切都很好用，但是当我点击按钮再次隐藏视频时，只有视频被隐藏，剩下的css不会恢复为默认状态。

我对jQuery有点新鲜，我确信有一些更简单的方法可以实现我在这里所做的事情。但我基本上需要在关闭点击时恢复默认值。

jQuery(document).ready(function() {
  jQuery("#bslvideoshow").click(function() {
    jQuery("#bslvideo").slideToggle("swing");
    jQuery(".container").css("width", "50%");
    jQuery(".container").css("margin", "0");
    jQuery(".content-navigation").css("display", "none");  
    jQuery("#sidebar-toggle").css("display", "block");
    jQuery("#sidebar-toggle").css("width", "50%");
    jQuery("#sidebar-toggle").css("float", "none");
    jQuery(".sidebar").css("width", "50%");
    jQuery(".sidebar .container").css("width", "100%");
    jQuery(".menu-item-389").css("display", "none");
    jQuery("#search").css("float", "none");
    jQuery("#search-field").css("width", "97%");
    jQuery(".top-bg-white").css("width", "50%");
    jQuery(".call-to-action").css("right","50%");
    jQuery(".sub-menu .attachment-full").css("display", "none");
  });
});