0

到目前为止，我一直无法让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 */

还有另一个关于这个的帖子没有答案。我相信我遇到了同样的问题 - 仅显示第一张图像并且幻灯片不播放。我发现了其他一些相当相似的问题，但没有任何解决方案或情况有所不同。

谢谢你的帮助！

4

2 回答 2

0

尝试这个

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

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

  });
</script>

代替 $(document).ready

于 2013-07-14T19:16:57.630 回答
0

用双码试试这个..

 <script>
          $(function () {
        $(".rslides").responsiveSlides({
        "auto": true,
        "speed": 1000,
        "maxwidth": 775
        });
});
    </script>
于 2016-01-13T10:50:09.687 回答