0

我在同一页面上有一个精美的盒子和一个 jquery 手风琴。每个人都独立工作，但不能一起工作。某处发生冲突。我查看了几个论坛和帖子，但无法修复。有人说先放 jquery-ui 脚本。那没有用。有人说将这些功能组合到一个脚本中。那没有用。

这是我页面的头部。

`<head>
`<title>Transportation Business Group</title>
`<meta name="KEYWORDS" content="International business group.">
`<link rel="stylesheet" href="/stylesheets/voglobalstyle.css" type="text/css" media="screen,projection">
`<link rel="stylesheet" href="stylesheets/style.css" type="text/css" media="screen,projection">
`<meta http-equiv="content-type" content="text/html; charset=utf-8">

`<script src="/scripts/jQuery-UI/1.8.17/jquery-ui.js" type="text/javascript"></script>
`<link rel="stylesheet" href="/scripts/jQuery-UI/1.8.17/Content/themes/base/twisty.ui.css"
    type="text/css" media="screen,projection" />
`<script type="text/javascript" src="/scripts/jquery/Plugins/fancybox/jquery-1.4.2.min.js"></script>
`<script type="text/javascript" src="/scripts/jquery/Plugins/fancybox/jquery.mousewheel-3.0.2.pack.js"></script>
`<script type="text/javascript" src="/scripts/jquery/Plugins/fancybox/jquery.fancybox-1.3.1.js"></script>
`<script src="/scripts/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
    $(document).ready(function () {
        /*
        *   Examples - images
        */
        $("#accordion").accordion({
            autoHeight: false,
            navigation: true,
            collapsible: true,
            active: true
        });
        $("a#MikeFormal").fancybox({
            'titleShow': true,
            'titlePosition': 'over',

            'autoScale': false
        });

        $("a#MikeInformal").fancybox({
            'titleShow': true,
            'titlePosition': 'over',

            'autoScale': false
        });



    });
</script>
 </head>

我将不胜感激您能给我的任何帮助。

4

2 回答 2

0

出于实际原因，一些插件在下载中包含了一个 jQuery 版本，但您只需要加载一个实例（可能的最新版本）。此外，必须首先加载 jQuery，在任何插件之前，甚至在 jQuery UI 之前。

在您的情况下，您在 jQuery UI 之后加载了 jQuery 两次。使用单个实例并将其放在文档中任何插件的前面。

此外，我没有看到您在代码中的任何位置加载了 fancybox CSS 文件。

于 2012-06-05T17:15:38.900 回答
0

您的脚本顺序应为：

<!-- Jquery must load first -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/scripts/jQuery-UI/1.8.17/Content/themes/base/twisty.ui.css"
    type="text/css" media="screen,projection" />
<script type="text/javascript" src="/scripts/jquery/Plugins/fancybox/jquery.mousewheel-3.0.2.pack.js"></script>
<script type="text/javascript" src="/scripts/jquery/Plugins/fancybox/jquery.fancybox-1.3.1.js"></script>

我注意到您还使用了旧版本的 jquery 核心和最新版本的 jQuery UI。我注意到的第二件事是您正在从本地服务器而不是 CDN 加载 jQuery Core 和 UI js 文件。我已将它们替换为 Google CDN 版本。

对于 Fancybox，您可能还想查看从CDNJS加载它们，但我暂时保留它们。

于 2012-06-05T17:19:20.593 回答