javascript - ResponsiveSlides 无法正常工作

标签 javascript jquery css asp.net

我正在使用 responsiveSlides Slider,但在自动模式为真之前它无法工作。 我有一个代码如下...

JS代码:

<script src="Scripts/responsiveslides.min.js" type="text/javascript"></script>
<script src="Scripts/responsiveslides.js" type="text/javascript"></script>
<link href="Styles/responsiveslides.css" rel="stylesheet" type="text/css" />    
<script type="text/javascript">
    (function () {
        $("#slider").responsiveSlides({
            maxwidth: 800,
            speed: 500
        });
    });    
</script>

这是CSS代码:

<style type="text/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;
      }
</style>

这是 html 代码:

<div id="wrapper">
    <ul class="rslides" id="slider">
        <li>
            <img src="Images/slide1.png" alt=""></li>
        <li>
            <img src="Images/slide2.png" alt=""></li>
        <li>
            <img src="Images/slide3.png" alt=""></li>
        <li>
            <img src="Images/slide4.png" alt=""></li>
        <li>
            <img src="Images/slide5.png" alt=""></li>
    </ul>
</div>

我还附上了 jquery.min.js 版本是 v1.8.3:

<script src="Scripts/jquery.min.js" type="text/javascript"></script>

并且我没有对responsiveSlides文件的所有css和javascript文件做任何更改,它们是原样,我已经附加了上面的文件。

最佳答案

您在 (function ()... 之前缺少 $

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

我成功了 http://jsfiddle.net/3J8vW/2/用你的代码。

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

相关文章:

javascript - 谁能解释为什么 jQuery 附加的内联 block 元素会丢失空间?

javascript - 初始化对象内的数组,在 localStorage 中使用

javascript - 从文本区域获取行并进行比较

javascript - String.fromCharCode 不返回所有值

javascript - .animate ScrollTop 可以工作但不流畅

javascript - 选择单选时 jQuery 更改字段

html - 如何并排放置两个iframe

CSS - 背景总是显示在 <img> 后面

html - 移动导航菜单在媒体查询收缩时显示和隐藏

javascript - 在谷歌脚本的电子表格中获取所选下拉列表的值