javascript - ResponsiveSlide.js 无法正常工作

标签 javascript jquery html responsive-slides

我正在尝试为动态创建的图像创建幻灯片放映。图像的目录路径作为 ajax 调用的响应返回,并且再次进行另一个 ajax 调用,这将为我的幻灯片创建 html 结构并将其作为响应返回,我将其附加到 html。

现在,我正在使用 ResponsiveSlide.js用于创建幻灯片放映。一切正常,并且还验证了 html 响应返回,因为它确实包含正确的图像路径(我通过从 url 单独加载图像来验证)但是不知何故幻灯片不会发生并且只显示一张图像。

这是JS:

$(function() {
   $("#slider1").responsiveSlides({
        maxwidth: 1000,
        speed: 800
      });
});

HTML代码是:

<ul class="rslides" id="slider1"></ul>

返回的响应是:

<li><img src="resources/images/Screenshots/Booking/Final.jpg"></li>
<li><img src="resources/images/Screenshots/Booking/0AFinal.jpg"></li>
<li><img src="resources/images/Screenshots/Booking/0BFinal.jpg"></li>

将此响应附加到 HTML ul 元素的 JS 代码是:

$.ajax({

            url: "/prismweb/results?directoryPath="+response,
            success: function (data) {
                $("#loading").hide();   //to hide the loading icon after ajax is completed
                $("#slider1").append(data);
            }
        });

添加了 JS 和 CSS:

    <script type="text/javascript" src="resources/js/jquery-2.1.4.min.js </script>

   <script type="text/javascript" src="resources/js/responsiveslides.min.js"></script>

控制台中的一切看起来都很好,当我在调试期间查看 Web 元素时所有图像都在那里,但只显示第一个 li 图像并且没有幻灯片放映。谁能让我知道这里出了什么问题?还有其他方法吗?

最佳答案

在下面的“maxwidth”和“speed”等参数中添加双冒号..谢谢

$(function() {
   $("#slider1").responsiveSlides({
        "maxwidth": 1000,
        "speed": 800
      });
});

关于javascript - ResponsiveSlide.js 无法正常工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34741952/

相关文章:

javascript - rxjs Observable.if 在使用 map 时总是执行这两个语句

html - 使用文本输入作为密码 html JavaScript 但不使用 type=password

jquery - 如何隐藏一张 table 并以漂亮的动画方式显示另一张 table ?

javascript - 如何使我的简单网站测验适合平板电脑和手机?

javascript - onclick on img 将链接到另一个页面上的特定部分

javascript - JavaFX Webview 不支持 window.FileReader javascript 的解决方法

javascript - Chart.js 根据时间单位求和 y 值

jquery - 如何使圆形 div 内的文本正确适合,其中 div 大小不固定?

jquery - 如何禁用 primefaces 中数据表的行选择

javascript - 无法让 setTimeout 在 javascript 中工作