Jquery 单击按钮将容器宽度设置为100%时更新FlexSlider2宽度

我在一个固定宽度的网站上使用FlexSlider2，但我试图为“全屏”视图制作一个按钮。基本上，该按钮所做的只是将主站点的容器div更改为100%宽度，并隐藏其他站点元素

下面是我的按钮功能代码：

    $('.fullscreen-toggle').click(function() {
        $('#container').toggleClass('full-width', 0);
        $('#header').toggleClass('hide', 0);
        $('#menu').toggleClass('hide', 0);
        $('#lower-content').toggleClass('hide', 0);
        $('.fullscreen-toggle span').toggle();
    });

我遇到的问题是，FlexSlider仅在调整窗口大小或使其进入或离开焦点时（通过更改浏览器选项卡）调整其图像/幻灯片宽度。我一直无法找到一种方法来“重新加载”FlexSlider时，按钮被点击，使图像是全宽。现在单击按钮时，一次会显示多张幻灯片，如下所示：

我尝试过的事情：

• 此插件：benalman（com）/projects/jquery resize插件/（删除链接以满足最小链接要求）
• 使用.load（）尝试刷新脚本（不要认为这是.load的预期功能，但我还是尝试了：s）
• 包括

  $（'#slider'）.flexslider（）再次调用.click（）函数

• 上面的其他变化，也许有些我甚至记不起来了！我做这件事已经有一段时间了

很抱歉，我无法直接链接到该网站，但如果您需要更多信息，请告诉我

更新 添加

$（'ul.li'）.css（“宽度”，$（'#容器'）.width（）+“px”）

to my.click函数可使图像大小正确，但仍同时显示两张幻灯片。这次他们完美地一分为二

更新2

---

Flexslider CSS:

在Flexslider.CSS文件中，您有这一行吗

.flexslider .slides img {width: 100%; display: block;}

---

我认为保持

宽度：100%

就足够每次只滑动一张图像了。

我的CSS中确实有这一点，我也将CSS文件添加到了原始问题中。使li标签与容器的宽度相同解决了我的尺寸问题，现在只需让幻灯片再次正确对齐即可。