如何将隐藏在自举手风琴中的jQuery循环幻灯片中心

Question

我正在使用bootstrap 3和jQuery Cycle 2（http://www.malsup.com/jquery/cycle2/）来构建一个带有隐藏幻灯片的手风琴。这是HTML：

<div data-toggle="collapse" data-target="#my-slideshow">
    <div>click to see slideshow</div>
</div>
<div class="collapse" id="my-slideshow">           
    <div id="slideshow" data-cycle-pause-on-hover="true" data-cycle-center-horz="true" data-cycle-auto-height="container" data-cycle-slides="> div">
        <div>slide 1. blah.....</div>
        <div>slide 2. blah.....</div>
        <div>slide 3. blah.....</div>
    </div>
</div>

这是JavaScript：

$('#slideshow').cycle({});

此HTML运行良好，除了一件事：幻灯片不在浏览器内。如果我从＃my-slideshow中删除类"崩溃"并加载页面，那么幻灯片确实位于屏幕上，但这不是我需要的。

我在移动网站上工作，屏幕尺寸是我需要隐藏页面加载幻灯片的原因（使用" Collapse"类）。有修复吗？

谢谢。

update

这是小提琴演示：http：//jsfiddle.net/mddc/fdh2k/10/（感谢Isherwood的Orginial Code！）。您可以通过添加和删除" Collpase"类看到效果。

Answer 1

我看到，如果您调整了浏览器大小（或JSFIDDLE中的面板），则会发生中心。这似乎表明居中插件在可见旋转木马之前无法做事。

使用自举倒塌回调可见后，请尝试以编程性初始化IT。