1

我有一个小问题，厌倦了试图解决它。jQuery 缓动代码在 jsfiddle 上完美运行，但不再在本地主机上的测试服务器上运行。当我删除 jQuery 缓动效果时，一切恢复正常，代码工作正常......

我想知道代码有什么问题吗？那是与 OnLoad 函数有关的东西还是什么......！

<head>
<script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js" type="text/javascript" ></script>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
  jQuery(function($) {
    $('.topnav li').find('a[href]').parent().each(function() {
        var li = $(this),
        a = li.find('a'),
        div = $('<div>' + '<\/div>');

        li.hover(function() {
           a.stop().animate({marginTop: '-64'}, 600, "easeOutBack");
        },
        function() {
           a.stop().animate({marginTop: '0'}, 500, "easeOutBack");
        })
       .append(div);
   });
});

这是JSFiddle 代码。

4

3 回答 3

2

试试这个，你包含 javascript 的顺序不正确。

<head>
 <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
 <script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js" type="text/javascript" ></script>
 <script src="http://www.google.com/jsapi" type="text/javascript"></script>
 <script type="text/javascript">
   $(document).ready(function(){
      $('.topnav li').find('a[href]').parent().each(function() {
        var li = $(this),
        a = li.find('a'),
        div = $('<div>' + '<\/div>');

        li.hover(function() {
        a.stop().animate({marginTop: '-64'}, 600, "easeOutBack");
      },
      function() {
        a.stop().animate({marginTop: '0'}, 500, "easeOutBack");
      })
      .append(div);
    });
  });
 </script>
</head>

我在本地测试过，（见截图）

在此处输入图像描述

希望对你有效。

于 2012-01-31T09:22:22.483 回答
1

抱歉，我还不能发表评论，所以...

看看 ianace 怎么说。

看看你的脚本标签后是否没有包含 jquery 脚本标签。您的代码脚本必须在依赖项之后加载，如下所示：

<script src="jquery.js> </script>
<script src="yours.js"> </script>
于 2012-01-31T07:03:02.200 回答
1

希望这可以帮助：

除了使用 jquery file.js，您还可以使用 google，如果需要，还可以使用 jquery-ui。这更加动态，您可以更改要使用的版本。

    <script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
        google.load("jquery", "1.7.1");
        //google.load("jqueryui", "1.7.3");
    </script>

之后，将您的 js 与 jquery 函数（您在 jsFiddle 中获得的代码）放在一起：

<script src="scripts/functions.js" type="text/javascript"></script>

它应该可以工作。

于 2012-01-31T07:11:21.470 回答