1

現在monacaにてjqueryを使って画像のドラッグ&ドロップをしようとしていますがうまくいきません。
headerでjqueryを読み込み

jQuery("#hogeDrag").draggable();

このようにしてますができません
ちなみに画像ではなくても動きません
画面が固定されていないのとは関係があるんでしょうか
よろしくお願いします。
ヘッダ

<script src="js/jquery2.1.3.min.js"></script>
<script src="js/jquery.ui.min.js"></script>

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; }

このようになっておりますよろしくお願い致します。

4
  • 丁寧にありがとうございます! ただ記載ミスで、uiも読み込んでいます。 原因がわからず数日泣きそうです
    – user9548
    Commented 2015年4月30日 6:57
  • jQuery UIを読み込んでいるのであればソースを載せた方が良いですよ。ソースがなければ回答が付きづらい質問だと思います。たぶん最小コードで動かすのが一番の近道でしょうけど・・・
    – kotatsu
    Commented 2015年4月30日 8:25
  • 同じ構成に変更しましたが動きますね。JavaScript側の問題ではないことになりますが、一度確実に動く小さいサンプルから所望の構成へ作りなおしてみてはいかがでしょうか。
    – kotatsu
    Commented 2015年4月30日 9:28
  • @user9548 kotatsuさんのスニペットをそちらで実行してみていただくのと併せて、ブラウザのJavascriptコンソールにエラーが出ていないか確認してください。
    – unarist
    Commented 2015年4月30日 9:31

1 件の回答 1

2

draggable()jQuery UIのメソッドです。
jQuery UIも読み込む必要があります。

$(function(){
    $('#draggable').draggable();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />

<div id="draggable" style="width: 100px; height: 100px; background: #eeddcc;">
    <p>drag me</p>
</div>

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。