looper.js 在 codeigniter 中使用控件

Question

我在网站上工作，我必须实现图像轮播。我的选择是 looper.js，因为它既简单又轻便。

但我在 codeigniter 中遇到问题:
- 我导入了样式 sheet.
- 我导入了 javascript 文件。
- 旋转木马有效。

但是当我想要实现控件时，问题就来了，因为我无法识别 "prev" 和 "next"。首先，不要放置箭头，然后如果我单击它会将我带到旋转木马 div 而不是更改幻灯片。

这是我实现的代码：

<div id="controlLooper" data-looper="go" class="looper slide" style="width: 100%; height: 312px; z-index: 0;">
    <div class="looper-inner">

        <?php
            foreach($images as $photo)
                {
                    echo "<div class='item'>";
                    echo "<img src='" . $this->config->item('base_url') . $this->config->item('img') . $this->config->item('car') . "/" . $photo . "' alt=''  style='width: 100%; height: 312px;' alt=''>";
                    echo "</div>";
                }
        ?>

    </div>

    <nav>
        <a class="looper-control" data-looper="prev" href="#controlLooper">
            <i class="icon-chevron-left"></i>
        </a>
        <a class="looper-control right" data-looper="next" href="#controlLooper">
            <i class="icon-chevron-right"></i>
        </a>
    </nav>

</div>

Answer 1

我注意到的问题是您正在使用 $('.looper').looper();，但您不需要，因为您已经在 div 中使用 data-looper="go"。希望对您有所帮助。

looper.js 在 codeigniter 中使用控件

looper.js with controls in codeigniter

javascript

codeigniter

looper