jqueryのUIドラッグ可能なウィンドウ

Question

Probabelyの外側から戻す、これは非常に単純な質問ですが、私はjQueryのでは初心者です...

私は、スクリプトを次のようしている。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js">/script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.js"> 

    </script> 

    <script> 
     $(function() { 

      $('li').draggable({ 
       containment: 'document', 
       revert: true 
      }); 


      $("#config").droppable({ 
       drop: function(event, ui) { 
       $(ui.draggable).appendTo("#schub"); 
       } 
      }); 

     }); 


    </script> 

そして、これは何を私の体であります含まれています

<div style="width:1800px; height:600px; background-color:#efefef;padding:10px;" > 
    <div style="float:left; width:1250px; height:580px; border:1px solid grey; padding:10px;" > 
     <div id="config" style="background-color:blue; border:1px solid black; width:700px; height:500px;"> 

      <ul id="schub" style="width:300px; height:500px;"></ul> 

     </div> 
    </div> 

<div style=" background-color:red;float:left; width:490px; height:580px; border:1px solid grey; margin-left:10px;padding:10px;" id="menu"> 
    <ul class="category"> 

     <li class="dragg" style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;"> 
     </li> 

     <li class="dragg" style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;"> 
     </li> 

     <li class="dragg" style="background-color:#e6e6e6; border:1px solid black; width:150px; height:98px;"> 
     </li> 

    </ul> 

</div> 

今私の問題：私はグレーをドラッグできるようにしたいですを赤色の<div>から青色の<div>に変換する。それは実際には機能しますが、灰色の<li>は、ウィンドウを外したときに常に青の<div>に戻ります。なぜそれが起こっているのですか？それは私の<li>私はそれらをドロップどこから戻ってposible？

ありがとうございました！

Answer 1

私は私が解決策を見つけたと思う：

問題は<li>はGEが追加しまった前に彼が持っているCSSスタイルと青のdivに新しい<ul>に追加取得していること、です。

<li>を新しい<ul id="schub">にドロップしたあとも、JqueryからのCSSはまだ残っています。これは約-1000pxです。 （<li>を右から左にドラッグするので、それが得られます）。その後、新しいulに追加されます。 ブラウザは<li>が<ul id="schub">の要素であり、左に-1000pxと考えます。それは窓の外にあります。定義は次のとおりです。 <li>に設定されているため、ウィンドウの外側から<ul id="schub">に戻ります。

私は実際に解決策を見つけるが、回避策はありませんでした：<li>に「クローン」：

は、我々が定義ヘルパーを追加することができます。私たちは元のクローンを手に入れます。実際にはドロップした時点から元に戻りませんが、ウィンドウの外側から元に戻らずに新しい<ul>に追加されます。