जब माउस jquery

Question

का उपयोग कर पृष्ठ के नीचे चलता है तो विंडो को स्वचालित रूप से स्क्रॉल कैसे करें मेरे पास 50 divs हैं, लेकिन मेरी विंडो में यह केवल 25 दिखाता है, मैं इन divs पर ड्रैग और ड्रॉप गतिविधि करता हूं। इसलिए यदि मैं अपना पहला div पास खींचता हूं 25 वें div, यह शेष div दिखाने के लिए स्वचालित रूप से स्क्रॉल करना चाहिए। मैं jquery में यह कैसे करूँ? कोई उपाय?

मैं Nestable नहीं खींचने योग्य()

Answer 1

इसे आपके विशिष्ट उपयोग मामले के आधार पर कुछ ठीक ट्यूनिंग की आवश्यकता होगी लेकिन ऐसा लगता है कि यह काफी अच्छा काम करता है।

Working Example

$('.dd').nestable({ /* config options */ 
}); 

$(window).mousemove(function (e) { 
    var x = $(window).innerHeight() - 50, 
     y = $(window).scrollTop() + 50; 
    if ($('.dd-dragel').offset().top > x) { 
     //Down 
     $('html, body').animate({ 
      scrollTop: 300 // adjust number of px to scroll down 
     }, 600); 
    } 
    if ($('.dd-dragel').offset().top < y) { 
     //Up 
     $('html, body').animate({ 
      scrollTop: 0 
     }, 600); 
    } else { 
     $('html, body').animate({ 

     }); 
    } 
}); 

संबंधित API दस्तावेज़:

• .mousemove()
• .innerHeight()
• .scrollTop()
• .offset()
• .animate()

Answer 2

आप जाँच कर सकते हैं आप विंडो के निचले भाग में जानना चाहते हैं

$(window).height() 

और $(window).scrollTop() उपयोग कर रहा हूँ;

Answer 3

मुझे पता है, यह एक पुराने विषय है लेकिन जब से इस सुविधा स्टैंडबाय में रहता है, मैं सिर्फ apaul34208 के कोड में सुधार आशा है कि यह मदद करता है

$(window).mousemove(function (e) { 
    if ($('.dd-dragel') && $('.dd-dragel').length > 0 && !$('html, body').is(':animated')) { 
     var bottom = $(window).height() - 50, 
      top = 50; 

     if (e.clientY > bottom && ($(window).scrollTop() + $(window).height() < $(document).height() - 100)) { 
      $('html, body').animate({ 
       scrollTop: $(window).scrollTop() + 300 
      }, 600); 
     } 
     else if (e.clientY < top && $(window).scrollTop() > 0) { 
      $('html, body').animate({ 
       scrollTop: $(window).scrollTop() - 300 
      }, 600); 
     } else { 
      $('html, body').finish(); 
     } 
    } 
});