jQuery幻灯片无法正常工作

时间:2013-03-22 06:47:29

标签: javascript jquery slideshow

我正在尝试在我的网站上设置此幻灯片。但由于某种原因,即使我无数次地检查过,也无法正常工作。

$(document).ready(function(){
    $("#sShowGallery").css("overflow", "hidden");
    $("#sShow_nav").css("visibility", "visible");
    $("#sShow_nav a[href=#sld1]").addClass("active");

    $("#sShow_nav").localScroll({
        target:'#sShowGallery', axis: 'x'
    });

    $("#sShow_nav a").click(function(){
        $("#sShow_nav a").removeClass("active");
        $(this).addClass("active");
    });
});

<div id="sShow">
    <div id="sShowGallery">
        <ul>
            <li id="sld1"><a href="#image1"><img src="resource/images/sShow/igcbanner.png" width="900" height="350" alt="image1" /></a></li>
            <li id="sld2"><a href="#image2"><img src="resource/images/sShow/slider_002.jpg" width="900" height="350" alt="image2" /></a></li>
            <li id="sld3"><a href="#image3"><img src="resource/images/sShow/slider_003.jpg" width="900" height="350" alt="image3" /></a></li>
        </ul>
    </div>
    <div id="sShow_nav">
        <ul>
            <li><a href="#sld1"><img src="resource/images/sShow/igcbanner.png" width="900" height="350" alt="image1" /></a></li>
            <li><a href="#sld2"><img src="resource/images/sShow/slider_002.jpg" width="900" height="350" alt="image2" /></a></li>
            <li><a href="#sld3"><img src="resource/images/sShow/slider_003.jpg" width="900" height="350" alt="image3" /></a></li>
        </ul>
    </div>
</div>

http://jsfiddle.net/2VQ9A/

它似乎只是在jsfiddle上运行,它就像我的浏览器没有被它识别出来一样奇怪。

这可能是一个愚蠢的问题,也是一个简单的答案。这是我第一次使用Javascript。

我会感激任何帮助:)!

2 个答案:

答案 0 :(得分:0)

包含这些文件

  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>

它正在小提琴中工作,这些都是问题。试着包括

答案 1 :(得分:0)

检查您添加了jquery files的页面,如:

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

或按CDNGoogle

之类的任何Microsoft添加这些文件

在添加上述文件后添加代码 像:

<script>
$(document).ready(function(){
    //your code
});
</script>