Question

视差内容滑块只能工作一次，但无法正常工作，没有任何错误。这里是示例http://vilamihu.didacticmedia.ro/，以下是代码的重要部分：

 <script type="text/javascript" src="js/modernizr.custom.28468.js"></script>
    <!--end slider -->
    <!---strat-date-piker---->
    <link rel="stylesheet" href="css/jquery-ui.css"/>
    <script src="js/jquery-ui.js"></script>
    <script>
        $(function () {
            $("#datepicker,#datepicker1").datepicker();
        });
    </script>
    <!---/End-date-piker---->
    <!--<link type="text/css" rel="stylesheet" href="css/JFGrid.css" />-->
    <link type="text/css" rel="stylesheet" href="css/JFFormStyle-1.css"/>
    <script type="text/javascript" src="js/JFCore.js"></script>
    <script type="text/javascript" src="js/JFForms.js"></script>
    <script type="text/javascript" src="js/jquery.cslider.js"></script>

那些在<head>。这是身体：

 <div id="da-slider" class="da-slider">
        <div class="da-slide">
            <div class="da-img">
                <img src="images/slideprimu.jpg" alt="" class="class1" />
            </div>
        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide1.jpg" alt="" class="class1"/>

            </div>

        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide2.jpg" alt="" class="class1"/>
            </div>
        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide3.jpg" alt="" class="class1"/>
            </div>
        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide4.jpg" alt="" class="class1"/>
            </div>
        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide5.jpg" alt="" class="class1"/>
            </div>
        </div>

        <div class="da-slide">
            <div class="da-img">
                <img src="images/slide6.jpg" alt="" class="class1"/></div>
        </div>

        <!--/slide -->
    </div>

这里是jquery：

 $(document).ready(function () {
        $('#da-slider').cslider({

            current: 4,
            // index of current slide

            bgincrement: 50,
            // increment the background position
            // (parallax effect) when sliding
            circular: true,
            autoplay: true,
            // slideshow on / off

            interval: 500
            // time between transitions

        });
    });

注意：照片链接很好。如果我更改“当前”设置，那么它将从该照片开始，转一次，然后停止。任何想法将不胜感激！谢谢！

Answer 1

试试这个

$(document).ready(function () {
    $('#da-slider').cslider({

        current: 4,
        // index of current slide

        bgincrement: 50,
        // increment the background position
        // (parallax effect) when sliding
        circular: true,
        autoplay: true,
        // slideshow on / off

        intervalSec: 500
        // time between transitions

    });
});

我刚刚将值interval的名称更改为intervalSec

根据documentation其他事情应该没问题

此外，在提供的网站链接中，您使用的是旧版本的jQuery v1.8.3 如果可能的话，将它更新到最新版本CDN，因为CSS3更新版本效果更好（注意：它不支持某些旧浏览器）

更新：在给定的网站链接中，有两个使用不同版本的JQuery UI

jQuery-UI 1.9.2
jQuery-UI 1.9.1

请删除旧版本（js / jquery-ui.min.js）以避免任何冲突..

Answer 2

今天我试图解决完全相同的问题。

尽管可能不再需要这个答案，但我会将其添加到会遇到同样问题的其他编码器中。

根本原因是 bgincrement 值。如果没有背景，它可以＆＃34;移动＆＃34;它将停止响应没有任何错误。它的一团糟。

将 bgincrement 设置为零使滑块再次起作用：

$(document).ready(function () {

    $('#da-slider').cslider({
        autoplay    : true,
        bgincrement : 0
    });
});

Answer 3

我遇到了同样的问题...请停用所有其他jquery插件，只允许滑块放置。不要忘记删除自定义js文件或html文件中的启动代码！通常，你的滑块毕竟在线工作。然后，您可以逐步重新添加插件，您将识别滑块与哪个插件不兼容。我有jQuery Timelinr 0.9.54插件阻止了我的滑块。

视差内容滑块自动播放不起作用

3 个答案: