0

caroufredsel をインストールしたところ、動作しません。私が期待しているのは、1つの画像が表示され、次または前をクリックすると、次または前の画像が表示されることです。以下のコードでは、すべての画像がリストに表示されています。私のコードは正しいように見えるので、私が間違っていることを理解していますか?

これが私のJQueryです：

<script type="text/javascript" language="javascript" src="js/jquery.carouFredSel-6.2.1-packed.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.mousewheel.min.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.touchSwipe.min.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.transit.min.js"></script>
        <script type="text/javascript" language="javascript" src="js/jquery.ba-throttle-debounce.min.js"></script>
        <script type="text/javascript">
            $('.caroufredsel-gallery').carouFredSel({
                    width: 601,
                    height: 'auto',
                    prev: '#prev3',
                    next: '#next3',
                    auto: false
                });

        </script>

そして、ここに私のHTMLがあります:

<div>
            <ul class="caroufredsel-gallery">

                    <li><img src="images/gallery/1.jpg" width="601" /></li>
                    <li><img src="images/gallery/2.jpg" width="601" /></li>
                    <li><img src="images/gallery/3.jpg" width="601" /></li>
                    <li><img src="images/gallery/4.jpg" width="601" /></li>
                    <li><img src="images/gallery/5.jpg" width="601" /></li>
                    <li><img src="images/gallery/6.jpg" width="601" /></li>
                    <li><img src="images/gallery/7.jpg" width="601" /></li>
                    <li><img src="images/gallery/8.jpg" width="601" /></li>
                </ul>
                <div class="clearfix"></div>
                <a id="prev3" class="prev" href="#">&lt;</a>
                <a id="next3" class="next" href="#">&gt;</a>
            </div><!--caroufredsel-gallery-->

どんな助けでも大歓迎です。

ありがとう、J

4

2 に答える 2

0

いくつかのことを試してみてください。

  • このスニペットを caroufredsel 呼び出しに入れます(items :1, scroll : 1)
  • これをcssに入れます(.caroufredsel-gallery li { float: left; })

うまくいけば、それは役に立ちます。また、使用しているブラウザのコンソールをチェックして、プラグインが実際に呼び出されていることを確認してください。それは、jQuery が見つからない、あるいは見つからない可能性さえあります。F12 を押すと、コンソールが表示されます。お役に立てれば。

于 2013-07-31T15:42:46.233 に答える
0

スクリプトを関数内に配置します。それはうまくいくはずです。最終的なスクリプトは次のようになります。

    <script type="text/javascript">
      $(function() {
        $('.caroufredsel-gallery').carouFredSel({
                width: 601,
                height: 'auto',
                prev: '#prev3',
                next: '#next3',
                auto: false
            });
       });
    </script>
于 2013-08-11T00:40:40.847 に答える