Question

我试图在CakePHP中运行我的bootstrap 3幻灯片代码而没有运气！它显示第一张图像，但不会绕过其他图像。上一个和下一个箭头也不起作用。这似乎是jquery问题，但我不知道如何解决它。（代码在bootstrap php中运行很好）

以下是代码的详细信息：

在slideshow.ctp中：

<!-- Wrapper for slides -->
    <div class="carousel-inner">
        <!-- Slide 1-->
        <div class="item active">
            <img src="http://placehold.it/1200x480" alt="Slide 1" />
            <div class="carousel-caption">
                <h1>Slide 1</h1>
                <p>Slide 1 Description</p>
            </div>
        </div>

        <!-- Slide 2-->
          <div class="item">
              <img src="http://placehold.it/1200x480" alt="Slide 2" />
              <div class="carousel-caption">
                  <h1>Slide 2</h1>
                  <p>Slide 2 Description</p>
              </div>
          </div>

      <!-- Slide 3-->
        <div class="item">
            <img src="http://placehold.it/1200x480" alt="Slide 3" />
            <div class="carousel-caption">
                <h1>Slide 3</h1>
                <p>Slide 3 Description</p>
            </div>
        </div>
      </div>

将bootstrap.js和bootstrap.min.js文件复制到webroot / js文件夹中。
：public $ helpers = array（＆＃39; Js＆＃39; =＆gt; array（＆＃39; Jquery＆＃39;））;
在default.ctp中：

echo $ this-＆gt; Html＆gt;脚本（＆＃39; http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min＆＃39;）;

echo $ this-＆gt; Html-＆gt;脚本（＆＃39; bootstrap＆＃39;）;

echo $ this-＆gt; Html-＆gt;脚本（＆＃39; bootstrap.min＆＃39;）; echo $ this-＆gt; Js-＆gt; writeBuffer（）; （标签前）

Answer 1

尝试更改

echo $this->Html->script('http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min');

到

echo $this->Html->script('http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js');

http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min似乎不是一个有效的链接。

您似乎还需要将旋转木马内部包裹在div中，然后将其初始化。

对html的更改：

<div id="this-carousel-id" class="carousel slide">
  <div class="carousel-inner">
    .
    .
    .
  </div>
</div>

并添加此js：

$(document).ready(function(){
  $('.carousel').carousel();
});

使用Cakephp中的Bootstrap 3轮播滑块

1 个答案: