1

このサイトはCargoで実行されています。このページの下部で、単純な20の質問タイプのゲーム(2列のテキスト)を作成しようとしています。私の目的は、クリックまたはホバーすると、誤ったステートメントのテキストの色を変更する、ある種のボタンを作成することです。

これが私が使用しているjQueryです:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">$(".showtrue").click(function() { $('.false').css('color','#f5f5f5');return false;});$(".showfalse").click(function() { $('.false').css('color','#999999');return false; });</script>

showtrueは、テキストの色をbgの色に設定することにより、falseステートメントを効果的に非表示にする関数です。showfalseはshowtrueをリセットします。

このページで使用しているHTMLは次のとおりです。

<div class="column"><p>Digs disco<br><span class="false">Was born in the 70s</span><br>Grew up in a vicious part of town<br><span class="false">Reads mathematics textbooks to relax</span><br><span class="false">Begins the day with a hundred push-ups</span><br>Was attacked by cockroaches after shooting a lizard</div><div class="column"><p><span class="false">Is a vegetarian</span><br>Was born in the 60s<br>Didn't use a computer until 2012<br><span class="false">Is a completely self-taught musician</span><br>Often sleeps with his guitar next to him<br>Has played on a freezing stage lit by a single naked bulb</div>

Only some of the above is <a class="showtrue" href="#">true</a> / <a class="showfalse" href="#">Reset</a>

私のコードは何もしていないようです。しかし、私のjQueryコードが私のCargoCSSを台無しにしたようです。たとえば、私の一番上のナビゲーション(修正されるはずです)は、ページの残りの部分と一緒にスクロールしています。トップナビゲーションで修正されるはずの「RunningOnCargo」リンクがトップナビゲーションの上に表示されるようになりました。

これらの問題に対処する方法がよくわかりません。ご協力いただければ幸いです。

ありがとう!

4

1 に答える 1

0

スクリプトをdocument.readyでラップします

 <script type="text/javascript">
  $('document').ready(function(){  
    $(".showtrue").click(function() { 
          $('.false').css('color','#f5f5f5');
          return false;
    });
   $(".showfalse").click(function() { 
     $('.false').css('color','#999999');
     return false;
    });
   });
  </script>
于 2012-10-23T04:27:00.300 に答える