ब्राउज़र स्क्रॉल होने पर गलत प्रारंभ स्थिति का उपयोग कर खींचने योग्य jQuery UI तत्व?

Question

मैं ड्रैगगेबल तत्व बनाने के लिए jQuery 1.4.2 और jQuery UI 1.8.5 का उपयोग कर रहा हूं जो उनकी मूल स्थिति पर वापस लौटता है। हालांकि एक समस्या है; जब आप ब्राउज़र विंडो को स्क्रॉल करते हैं तो प्रारंभ स्थिति कहीं और शुरू करने के लिए बदल दी जाएगी। ऐसा लगता है कि एक पूर्ण स्थिति का उपयोग किया जाता है लेकिन स्क्रॉल किए गए राशि को ध्यान में नहीं रखा जाता है, लेकिन मुझे यकीन नहीं है। मैंने फ़ायरफ़ॉक्स में अपना पूरा विकास और परीक्षण किया है।

यहाँ एक लघु वीडियो है कि मैं इस बारे में दर्ज की गई है है .. http://www.youtube.com/watch?v=KPW4ljpjuF8

जावास्क्रिप्ट प्रवर्तन कोड इस तरह दिखता है ..

$('.frameworkNavigationItem').draggable({ 
     appendTo : 'body', 
     revert : 'invalid', 
     containment : 'body', 
     zIndex : 999 
    }); 

तत्वों में से एक के एचटीएमएल इस तरह दिखता है ..

<div class="frameworkNavigationItem frameworkNavigationItemColor"> 
    <div class="frameworkNavigationItemName">Home</div> 
    <div class="frameworkNavigationItemDisplay"> 
     <input type="checkbox" checked="true" name="2_1"> 
     <input type="checkbox" checked="true" name="2_2"> 
     <input type="checkbox" checked="true" name="2_4"> 
    </div> 
    <div class="frameworkNavigationItemController"> 
     <input type="text" maxlength="255" value="mainNews" name="2_co"> 
    </div> 
    <div class="frameworkNavigationItemChild"> 
     <select name="2_ch"> 
      <option value="0">-</option> 
     </select> 
    </div> 
    <div style="clear: both;"></div>   
</div> 

और यह सीएसएस इसके साथ जाने के लिए है।

.frameworkNavigationItem 
    { 
     background-color   : #CACACA; 
     height      : 20px; 
     line-height     : 20px; 
     margin      : 2px 0; 
     vertical-align    : middle; 
    } 

     .frameworkNavigationItem:hover 
     { 
      background-color   : #BABABA; 
     } 

      .frameworkNavigationItem:hover input, .frameworkNavigationItem:hover select 
      { 
       background-color   : #BABABA; 
      } 

     .frameworkNavigationItem input, .frameworkNavigationItem select 
     { 
      background-color   : #CACACA; 
      border      : 0; 
      font-size     : 10px; 
     } 

     .frameworkNavigationItemColor 
     { 
      background-color   : #DADADA; 
     } 

      .frameworkNavigationItemColor input, .frameworkNavigationItemColor select 
      { 
       background-color   : #DADADA; 
      } 

     .frameworkNavigationItemName 
     { 
      float      : left; 
      height      : 15px; 
      padding-left    : 5px; 
     } 

     .frameworkNavigationItemDisplay 
     { 
      float      : right; 
      text-align     : right; 
      width      : 48px; 
     } 

     .frameworkNavigationItemController 
     { 
      float      : right; 
      width      : 160px; 
     } 

      .frameworkNavigationItemController input 
      { 
       width     : 150px; 
      } 

     .frameworkNavigationItemChild 
     { 
      float      : right; 
      width      : 160px; 
     } 

      .frameworkNavigationItemChild select 
      { 
       width     : 150px; 
      } 

कृपया मेरी मदद करें! मुझे नहीं पता कि यह क्यों हो रहा है।

Answer 1

यह व्यापक जवाब यहां है:

यकीन है कि माता-पिता तत्व (घटना अगर यह शरीर है) अतिप्रवाह है बनाओ:: jQuery draggable shows helper in wrong place after page scrolled

इस सुधार में जो मेरे लिए काम किया है ऑटो; सेट। मेरे परीक्षण से पता चला कि यह समाधान स्थिति को हल करता है, लेकिन यह ऑटोस्कोल कार्यक्षमता को अक्षम करता है। आप अभी भी मूसहेल या तीर कुंजी का उपयोग कर स्क्रॉल कर सकते हैं।