问题实现jQuery Nivo Slider

时间:2012-04-23 17:31:41

标签: jquery

我能够在我的JSFiddle中实现jQuery Nivo Slider: http://jsfiddle.net/NinjaSk8ter/gXwuc/

但是我在使用这个页面时遇到问题。如果有人能够在我的JavaScript中看到问题,我将非常感激。

我认为问题是因为我已经为不同的脚本调用了jQuery Ready函数。

我在其自己的ready函数中添加了('#slider').nivoSlider();,但该函数不起作用:

$(function () {
    $('#slider').nivoSlider();
});

这是开发网站: http://www.northernvirginiapaintingcontractor.com/

有2个jQuery文档就绪函数:

<script type="text/javascript">
$(function () {
    $('.box').hover(function () {
        $(this).stop().animate({
            "opacity": .5
        }, 50)
    }, function () {
        $(this).stop().animate({
            "opacity": 1
        }, 50)
    });
});

$(function () {
    $('#slider').nivoSlider();
});

</script>

这是标记:

<div id="top-feature">
    <div id="wrapper">
        <a href="http://dev7studios.com" id="dev7link" title="Go to dev7studios"></a>
        <div class="slider-wrapper theme-default">
            <div class="ribbon"></div>
            <div id="slider" class="nivoSlider">
                <img src="http://i.imgur.com/DMWEZ.jpg" alt="" />
                <a href="http://dev7studios.com">
                    <img src="http://i.imgur.com/GnASW.jpg" alt="" title="caption" />
                </a>
                <img src="http://i.imgur.com/5y96P.jpg" alt="" data-transition="slideInLeft" />
                <img src="http://i.imgur.com/9eg2i.jpg" alt="" title="#htmlcaption" />
            </div>
            <div id="htmlcaption" class="nivo-html-caption">
                <strong>This</strong> example <em>HTML</em> caption<a href="#">a link</a>.
            </div>
        </div>
    </div>
</div>

1 个答案:

答案 0 :(得分:0)

出于某种原因,这适用于Page,我并不完全清楚原因:

jQuery(function ($) {
    $('#slider').nivoSlider();
});