Question

由于它的简单性，我一直在使用http://responsiveslides.com/的图片滑块，这正是我所追求的。

因此，对于滑块，您有HTML

<ul class="rslides">
  <li><img src="1.jpg" alt=""></li>
  <li><img src="2.jpg" alt=""></li>
  <li><img src="3.jpg" alt=""></li>
</ul>

CSS

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 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: 0;
  }

JS

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

http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js

我感觉主要的javascript文件太长了，所以如果你可以通过源代码，我会很感激，但提前道歉。由于声誉问题，我也无法发布。

现在我使用的滑块已经布局了，我遇到的问题是当我将HTML粘贴在体内时我的最终结果是图像＃1没有任何移动所以基本上只是尝试找出原因。

我之前通过Stackoverflow进行了研究，看到了类似的问题，并看到了对javascript函数的小脚本标记所做的更改，但是我更新了这些问题并且它从未改变任何内容。

另一个要说的是，当我检查控制台时，它显然表示responsiveSlides不是一个函数，但是当我在本地检查控制台中的原始滑块时，它的功能完全正常且控制台没有错误。

任何支持都将不胜感激，这很乏味，希望这是一个简单的问题。

问候。

Answer 1

手头似乎存在jquery不兼容问题。 responsiveslides.js使用$slide.size()，而使用jQuery 1.8+的用户应使用$slide.length。

从jQuery 1.8开始，不推荐使用

.size()。

改为使用this version I forked。

演示： http://jsfiddle.net/svArtist/rfn7z5g2/

图像滑块

1 个答案: