3

asp.netアプリケーションでnivojquery画像スライダーを使用していますが、ページの読み込み後、画像は変更されず、「loading.gif」画像のみが表示されます。jqueryのデバッグ時にエラーメッセージ$('#slider')が表示されます。 nivoSlider(); 関数ではありません。

   <link href="css/NivoSlideThemes/default/default.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="css/NivoSlideThemes/nivo-slider.css" rel="stylesheet" type="text/css" media="screen"  />
    <script src="js/menu/jquery-1.7.2.min.js" type="text/javascript"></script>     
    <script src="js/jquery.nivo.slider.pack.js" type="text/javascript"></script>

    <script type="text/javascript">
        $(window).load(function () {
            $('#slider').nivoSlider();
        });
        </script>
          <style>   

            .theme-default #slider {
                margin:1px auto 0 auto;
                width:674px; /* Make sure your images are the same size */
                height:311px; /* Make sure your images are the same size */
            }
            .theme-pascal.slider-wrapper,
            .theme-orman.slider-wrapper {
               /* margin-top:150px;  */
            }

            .clear {
                clear:both;
            }

      </style> 

       <div class="slider-wrapper theme-default"> 
            <div id="slider" class="nivoSlider">
                <img src="images/cfgSliderImages/1.gif" alt="" />
                <img src="images/cfgSliderImages/2.gif" alt="" title="Solar Power" />
                <img src="images/cfgSliderImages/3.gif" alt="" data-transition="slideInLeft" />
                <img src="images/cfgSliderImages/4.gif" alt=""   title="#htmlcaption" />
            </div>
            <div id="htmlcaption" class="nivo-html-caption">
                <strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
            </div>
        </div>
4

2 に答える 2

10

これを試して:

jQueryと競合している可能性があるため、次を使用して.noConflict()ください。

var j = jQuery.noConflict();
j(document).ready(function () {
    j('#slider').nivoSlider();
});
于 2012-06-14T15:32:11.313 に答える
0

Visual Studioを時々使用しているときに、この問題が発生します。のスクリプトを参照する代わりに、スクリプトをbodyに追加しますhead

<head>
    <link href="css/NivoSlideThemes/default/default.css" rel="stylesheet" type="text/css" media="screen" />
    <link href="css/NivoSlideThemes/nivo-slider.css" rel="stylesheet" type="text/css" media="screen"  />
    <script src="js/menu/jquery-1.7.2.min.js" type="text/javascript"></script>     
    <script src="js/jquery.nivo.slider.pack.js" type="text/javascript"></script>
</head>

これは特にjQueryでも問題になっています。

ただし、JavaScriptをドキュメントレディ関数に配置する必要があります。

// When the page is ready to be manipulated
$(function() {
        $(window).load(function () {
            $('#slider').nivoSlider();
        });
});
于 2012-06-14T15:33:01.413 に答える