jquery - Bootstrap 轮播在 PrestaShop 中不起作用

Question

我用这个模板创建了一个模块:

<div class="row gryfnieslider">
<div class="col-xs-12">
    <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
      <!-- Indicators -->
      <ol class="carousel-indicators">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
      </ol>

      <!-- Wrapper for slides -->
      <div class="carousel-inner" role="listbox">
        <div class="item active">
          <img src="{$testval}/one.jpg" alt="...">
          <div class="carousel-caption">
            ...
          </div>
        </div>
        <div class="item">
          <img src="{$testval}/one.jpg" alt="...">
          <div class="carousel-caption">
            ...
          </div>
        </div>
        ...
      </div>

      <!-- Controls -->
      <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
</div>

我正在使用 Hook (displayLeftColumn) 显示此模板。我也在使用默认 Bootstrap 主题。

我的问题:

轮播根本没有样式。 Bootstrap 的 JS 运行良好(切换“事件”类等)，但其 CSS 完全不适用于此 slider 。我不知道我做错了什么。 Bootstrap 的 CSS 链接正确(我的第二个模块中的列样式很好)，Bootstrap 的 JS 也链接得很好。

我的两个模块都使用了这些 Hook :

<div class="container">
    <div class="row slider">
        <img src="{$js_dir}../img/big/slider.jpg" />
    </div>
    {hook h='displayLeftColumn' mod='gryfnieslider'}                
    {hook h='displayLeftColumn' mod='productsload'}

</div>

从前台看我的模块是这样的:

如您所见 - 它不是 slider ，它基本上是一张接一张的垂直滑动。

能否请您向我解释一下轮播为什么会这样？为什么没有样式？它的列 (col-xs-12) 样式很好。

如有任何帮助，我将不胜感激!

Answer 1

我解决了这个问题。

我突然想到，并非所有来自 Bootstrap 的样式都加载到我的主题中。例如 - 列是，轮播不是。我应用了 Bootstrap CSS 的全新副本，现在一切正常。