-1

これが私が取り組んでいるものです：

  <script>

  $(document).ready(function() {

  $("#cf7_controls").on('click', 'span', function() {

  $("#cf7 img").removeClass("opaque");

  var newImage = $(this).index();

  $("#cf7 img").eq(newImage).addClass("opaque");

  $("#cf7_controls span").removeClass("selected");

  $(this).addClass("selected");

  });

  });

  </script>   <div class="row">
    <div class="span 6">
        <div id="cf7" class="shadow">
            <img class='opaque' src="/img/Cirques.jpg" />
            <img src="/img/ClownFish.jpg" />
            <img src="/img/Stones.jpg" />
            <img src="/img/Summit.jpg" />
        </div>
        <p id="cf7_controls">
            <span class="selected">Image 1</span>
            <span>Image 2</span>
            <span>Image 3</span>
            <span>Image 4</span>
        </p>
    </div>
    <div class="span 6">
        <div id="cf7" class="shadow">
            <img class='opaque' src="img/Cirques.jpg" />
            <img src="img/ClownFish.jpg" />
            <img src="img/Stones.jpg" />
            <img src="img/Summit.jpg" />
        </div>
        <p id="cf7_controls">
            <span class="selected">Image 1</span>
            <span>Image 2</span>
            <span>Image 3</span>
            <span>Image 4</span>
        </p>
    </div>

このコードをhttp://css3.bradshawenterprises.com/cfimg/#cfimg7から取得しました

残念ながら、うまくいきません。私の WIP のライブ デモは、http://marc-with-ac.com で見ることができます。

Google chrome のエラー: Uncaught ReferenceError: $ is not defined marc-with-ac.com/:97

助けてくれてありがとう！

4

3 に答える 3

3

ページに jQuery ライブラリが含まれていません

script 要素の前に jQuery を含める行を追加します。

<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
    $(document).ready(function() {

        $("#cf7_controls").on('click', 'span', function() {
            $("#cf7 img").removeClass("opaque");

            var newImage = $(this).index();

            $("#cf7 img").eq(newImage).addClass("opaque");
            $("#cf7_controls span").removeClass("selected");
            $(this).addClass("selected");
        });
    });
</script>
于 2013-08-12T00:28:12.323 に答える
1

jqueryを含める必要があります

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
于 2013-08-12T00:29:14.467 に答える
0

これは、実際には を使用して記述されたコードですjquery。次のように、コードを jquery フレームワークに参照する必要があります。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

または、Web サイトでフレームワークの縮小版をダウンロードすることもできます。

www.jquery.com

そしてあなたのコードへの参照

<script type = "text/javascript" src = "changeThisToThePathWhereYouSaveTheDownloadedJqueryFramework"></script>

<script type = "text/javascript">
    //your actual code here
</script>
于 2013-08-12T00:53:03.023 に答える