JQueryUIでdraggableがうまく機能しません

monacaにてjquerymobileを使って作業していてDnDを使おうとしたところ
うまく動作しません。色々調べてみましたが解決しませんのでよろしくお願い致します。

ヘッダで

htmlで

<div id="draggable" class="ui-widget-content"> <p>Drag me around</p> </div>

jsで
$(function() {
$( "#draggable" ).draggable();
});

cssで
#draggable { width: 150px; height: 150px; padding: 0.5em; }

とまあ公式どうりやってみたのですが動作しません。
原因がわかりませんのでよろしくお願い致します。

行動規範の内容に同意します

回答1件

書かれている内容自体に問題は見当たらなさそうなので、HTML全体を見ないと原因にたどりつけなさそうですが、とりあえず動くコードを書いておきますね。

lang
1<!doctype html>
2<html lang="ja">
3<head>
4  <meta charset="utf-8">
5  <title>jQuery UI Draggable</title>
6  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
7  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
8  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
9  <style>
10  #draggable { width: 150px; height: 150px; padding: 0.5em; }
11  </style>
12  <script>
13  $(function() {
14    $( "#draggable" ).draggable();
15  });
16  </script>
17</head>
18<body>
19 
20<div id="draggable" class="ui-widget-content">
21  <p>Drag me around</p>
22</div>
23
24</body>
25</html>