无法识别jQuery用户界面_Jquery_Jquery Ui_Jquery Ui Draggable

无法识别jQuery用户界面

jquery jquery-ui

无法识别jQuery用户界面,jquery,jquery-ui,jquery-ui-draggable,Jquery,Jquery Ui,Jquery Ui Draggable,具体地说，我有一个div容器，其中包含另一个div，并设置了它的背景图像。我想做的是制作一张拖拽/滚动地图，类似于谷歌地图的设计，没有缩放功能。在我看来，这一点毫无瑕疵。但是，我的本地文件不允许此拖动/滚动功能。我在jQuery/UI上使用谷歌的开发者链接，但仍然没有用。此外，我使用Dreamweaver CS6进行本地开发。任何帮助都会很好。谢谢 HTML: JS: 这可能不是你的问题，但很可能是：如果没有在页面上引用库（通常在标记中），jQuery代码将无法工作此外，还有一些其他库构建在

具体地说，我有一个div容器，其中包含另一个div，并设置了它的背景图像。我想做的是制作一张拖拽/滚动地图，类似于谷歌地图的设计，没有缩放功能。在我看来，这一点毫无瑕疵。但是，我的本地文件不允许此拖动/滚动功能。我在jQuery/UI上使用谷歌的开发者链接，但仍然没有用。此外，我使用Dreamweaver CS6进行本地开发。任何帮助都会很好。谢谢

HTML:

JS:

这可能不是你的问题，但很可能是：

如果没有在页面上引用库（通常在

标记中），jQuery代码将无法工作

此外，还有一些其他库构建在jQuery库的基础上，比如Twitter的优秀库或。在这些情况下，您需要jQuery库和附加库——如下面第一个示例中的jQueryUI所示

在页面上包含jQuery库有几个选项

CDN（内容交付网络）是在线存储位置，网页可以在其中获取指定代码，而无需将其存储在服务器上

一:一。使用CDN：

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
</head>

上述代码执行以下操作：

a。从CDN加载jQuery库
B如果未加载CDN，则从我的服务器上的指定位置加载jQuery（请注意，jQuery库也必须在您的服务器上的指定位置可用）

注意事项：

您可以使用两种形式的jquery.js代码：缩小的和常规的。不同之处在于，缩小后的代码加载速度更快，但常规代码是人类可读的。你想用哪一个都行。如果有一天您决定为自己的目的定制jQuery库，那么您将需要编辑可读的jQuery库

在继续之前，您是否在html标题中包含了jquery？您看到了什么错误？您是否检查了控制台输出以查看Jquery ui等是否有404个错误？是的，它们在标题中，正在检查控制台。它引用：$not recognized有趣，因为其他页面使用了相同的CDN，并且工作正常。因此这在DW中的fiddle和quicktest页面上起作用，但是我的整个网站已经更新了，它仍然拒绝让图片可以拖动。这是我的一份复印件。同样，如果你能帮我弄清楚为什么地图不能自由移动，我将不胜感激和$ui链接，所有代码都正常工作@gibberish最初就有这个功能，并意识到它必须在CDN地址的开头包含“http:”。

#drag {
width: 1000px;
height: 1100px;
background-image: url(http://www.shepherd.edu/university/visitors/images/campus.jpg);
}

#container {
width: 300px;
height: 200px;
overflow: hidden;
border: 2px solid green;
}

$(document).ready(function() {
$('#drag').draggable();
})

<head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
</head>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
<script> window.jQuery || document.write('<script src="../js/jquery-1.10.2.min.js"><\/script>')</script>