Question

我已经在货物上运行了this site。在这个页面的底部我试图创建一个简单的20问题类型的游戏（两列文本）。我的目标是创建某种按钮，当点击或悬停时，会改变虚假陈述的文本颜色。

这是我正在使用的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颜色来有效隐藏虚假语句的函数，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代码似乎与我的Cargo CSS搞混了。例如，我的顶级导航（应该是固定的）现在滚动与页面的其余部分。应该用顶部导航修复的“Running On Cargo”链接现在出现在顶部导航上方。

我不确定如何解决这些问题，我们将非常感谢任何帮助。

谢谢！

Answer 1

将您的脚本包装在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>

使用Cargo Collective站点实现jQuery

1 个答案: