Javascript jQuery弹跳效果对列表项不起作用。为什么？

我到处找，试过各种各样的方法，但都不管用。我看到这两个问题和他们的回答（显然有效），但似乎对我不起作用：

我想让我的网站上的列表项目在单击时反弹。这是我的HTML：

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

但它们似乎不起作用

在前面的一个问题中，它说让列表项向左浮动，而不是内联显示，我这样做了，但它仍然没有解决这个问题

我有一种奇怪的感觉，这与HTML中的脚本引用有关。这些都做对了吗

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

我真的不明白为什么它不起作用。有人能帮忙吗

---

编辑：我制作了这个提琴：它在那里工作，我看不出我的代码与之有什么不同。

你必须在jQuery之后包含jQuery ui，否则什么都不起作用

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

何时开始

$('li a').hover(function () {
    $(this).effect("bounce", { times: 3 }, 300);
})​

被处决？它是否可能在dom完全加载之前运行，因此li不存在

编辑： 它看起来好像是在页面完全加载之前运行的。尝试将脚本标记移动到页面底部，或者将其包装到文档中。就绪ie:

$(document).ready(function() {
  $('li a').hover(function () {
    $(this).effect("bounce", { times: 3 }, 300);
  })​
});

---

你需要在

jquery ui.min.js

之前加入

jquery-1.6.3.min.js

。我更新了网站的HTML来做到这一点，但仍然不起作用。更新了网站的HTML来做到这一点。还是没什么。把它包装在一个文件里，准备好了，它工作得很好。干杯

$(document).ready(function() {
  $('li a').hover(function () {
    $(this).effect("bounce", { times: 3 }, 300);
  })​
});