Question

到目前为止，我无法让ResponsiveSlides在任何浏览器上运行（Chrome，Firefox，Safari）。我几乎使用了网站上的确切代码，但这就是我所拥有的：

在标题中：

<head>
<link href="main.css" rel="stylesheet" media="screen" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" ></script>
<script src="js/responsiveslides.min.js" ></script>
<script>
        $(document).ready(function() {
        $(".rslides").responsiveSlides({
    auto: true,
    speed: 1000,
    maxwidth: 775
    });
</script>
</head>
<body>

紧接着身体：

<div id="content" >
<div id="header" >
    <ul class="rslides" >
        <li><img src="images/slider/1.png" /></li>
        <li><img src="images/slider/2.png" /></li>
        <li><img src="images/slider/3.png" /></li>
        <li><img src="images/slider/4.png" /></li>
        <li><img src="images/slider/4.png" /></li>
    </ul>
    </div>
</div>

在css（最顶层）：

/* BEGIN SLIDESHOW */

.rslides {
position:relative;
list-style-type:none;
list-style-position:initial;
list-style-image:initial;
overflow:hidden;
width:100%;
margin:0;
padding:0;
}

.rslides li {
-webkit-backface-visibility:hidden;
position:absolute;
display:none;
width:100%;
left:0;
top:0;
}

.rslides li:first-child {
position:relative;
display:block;
float:left;
}

.rslides img {
display:block;
height:auto;
float:left;
width:100%;
border-image:initial;
}

/* END SLIDESHOW */

有another post这个没有答案。我相信我遇到了同样的问题 - 只显示第一张图片而幻灯片播放不播放。我发现了一些其他相当类似的问题，但没有解决方案或情况不同。

感谢您的帮助！

Answer 1

试试这个

<script>
  $(function() {
    $(".rslides").responsiveSlides(

{
    auto: true,
    speed: 1000,
    maxwidth: 775
});

  });
</script>

而不是$(document).ready

Answer 2

尝试使用双重代码..

 <script>
          $(function () {
        $(".rslides").responsiveSlides({
        "auto": true,
        "speed": 1000,
        "maxwidth": 775
        });
});
    </script>

ResponiveSlides不工作 - 任何浏览器

2 个答案: