Jquery 为什么我的div破了，为什么没有'；我的反弹效果不起作用吗？

对于一个班级，我们正在设计一个网站（可以在这里找到：），我正在玩它一点

由于该网站应该面向儿童，我想让它更具互动性和趣味性，并让顶部的选项卡按钮在单击时反弹。然而，我在做这件事时遇到了一些麻烦

首先，在我的HTML中，我为所有链接添加了div，因此我可以使用jQuery访问按钮以获得反弹效果，但当我这样做时，它似乎破坏了我的CSS。（请参阅：除联系人页面外的所有页面，我在其中删除了div。）

以下是导航选项卡HTML：

<div id = "links">
    <div class="bounce-tab"><a href = "index.html" class="tab">Home</a></div>
    <div class="bounce-tab"><a href ="math.html" class="tab">Learn Math</a></div>
    <div class="bounce-tab"><a href ="geography.html" class="tab">Learn Geography</a></div>
    <div class="bounce-tab"><a href ="spelling.html" class="tab">Learn Spelling</a></div>
    <div class="bounce-tab"><a href ="music.html" class="tab">Learn Music</a></div>
    <div class="bounce-tab"><a href ="contact.html" class="tab">Contact Teacher</a></div>
</div>

以下是我在HTML中对它的引用：

<script type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="javascript/scripts.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>

---

所以基本上，有人能帮我让CSS重新工作，让按钮弹起吗？提前感谢。

div

是块级元素，意味着它们彼此堆叠在一起

在你的联系人页面上有一个div，里面有你所有的链接

而不是在

div

的

span

中换行，因为默认情况下，它们将从左到右串联运行

例如

---

jQuery和jQuery UI必须在scripts.js之前加载，因为您的代码依赖于这两者

---

加载额外版本的jQuery（1.3）只会增加更多问题……只加载jQuery一次

去掉加载jQuery 1.3的行。更新jQueryUI也不会有什么坏处——它们现在在1.8.17版本上。我不知道你做了什么，因为需要做一些事情才能使浏览器崩溃而不会挂起很长时间…我建议你使用一个

，无序列表作为链接，因为这正是你的特别div结构想要的；另外，对于残疾人来说，屏幕阅读器也会更友好。我尝试过这个，甚至留下了你的示例代码，但它不起作用<代码>$（document）.ready（函数（）{uncaughtreferenceerror:$未在scripts.js的第1行定义），您需要包含jQuery，然后才能进行类似$（document）.ready（）的jQuery调用我还强烈建议您下载FireFox的firebug或使用Google Chrome上的调试控制台，它们都会告诉您有什么不对，我怎么不包括jQuery？您是，但浏览器会从上到下阅读您的网页，它首先加载您的

脚本。js

它不知道如何处理

$（文档）。ready（）

因为此时您还没有加载jQuery，所以它会加载jQuery。加载jQuery后再加载

脚本.js

好的，我现在就这么做了，它显然正在进步，但仍然不能正常工作。

<script type="text/javascript" src="javascript/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="javascript/scripts.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>