पता लगाएँ कि क्या उपयोगकर्ता स्क्रॉल कर रहा है

Question

अगर उपयोगकर्ता स्क्रॉल कर रहा है तो मैं जावास्क्रिप्ट में कैसे पता लगा सकता हूं?

Comments

नहीं, मैं दूसरे फ़ंक्शन से लिखना चाहता हूं if(scolling)। है if(window.onscroll)ही?

— user1365010

आप सेट कर सकते scrollingमें onscroll। (पीएस: नहीं, यह वही नहीं है)

— रॉकेट हज़मत

उपयोगकर्ता कभी 'स्क्रॉल नहीं कर रहा है'। केवल स्क्रॉल कार्रवाई है, स्क्रॉल राज्य नहीं है।

— केंडल फ्रे

@ user1365010: D'OH! मैंने ऐसा नहीं सोचा था। वास्तव में आप क्या करने की कोशिश कर रहे हैं? यदि उपयोगकर्ता स्क्रॉल कर रहा है तो आपको यह जानने की आवश्यकता क्यों है?

— रॉकेट हज़मत

दिलचस्प। मैंने कभी स्क्रॉल को 'रिबूट' नहीं किया। विस्तृत करने के लिए परवाह?

— केंडल फ्रे

Answer 1

यह काम:

window.onscroll = function (e) {  
// called when the window is scrolled.  
} 

संपादित करें:

आपने कहा कि यह एक TimeInterval में एक फ़ंक्शन है ..
इसे इस तरह से करने का प्रयास करें:

userHasScrolled = false;
window.onscroll = function (e)
{
    userHasScrolled = true;
}

फिर अपने अंतराल के अंदर यह डालें:

if(userHasScrolled)
{
//do your code here
userHasScrolled = false;
}

Comments

लेकिन यह एक setInterval में एक समारोह है!

— user1365010

@ user1365010: क्या है? तुम्हारी किस बारे में बोलने की इच्छा थी? आपको प्रश्न पर अधिक विवरण जोड़ने की आवश्यकता है।

— रॉकेट हज़मत

@ user1365010 यह उत्तर (इसके मूल में) सबसे अच्छा आप कर सकते हैं।

— मैट बॉल

#FYI, यह तब नहीं लग रहा है जब कंटेनर स्क्रॉल कर रहा था, body.scroll () काम करता है, इसलिए मैंने दोनों को जोड़ा,

— सेल्वा गणपति

Answer 2

आपने सिर्फ अपने टैग्स में जावास्क्रिप्ट कहा है, इसलिए @Wampie Driessen पोस्ट आपकी मदद कर सकती है।

मैं भी योगदान करना चाहता हूं, इसलिए यदि आपको आवश्यकता हो तो आप jQuery का उपयोग करते हुए निम्नलिखित का उपयोग कर सकते हैं।

 //Firefox
 $('#elem').bind('DOMMouseScroll', function(e){
     if(e.detail > 0) {
         //scroll down
         console.log('Down');
     }else {
         //scroll up
         console.log('Up');
     }

     //prevent page fom scrolling
     return false;
 });

 //IE, Opera, Safari
 $('#elem').bind('mousewheel', function(e){
     if(e.wheelDelta< 0) {
         //scroll down
         console.log('Down');
     }else {
         //scroll up
         console.log('Up');
     }

     //prevent page fom scrolling
     return false;
 });

एक और उदाहरण:

$(function(){
    var _top = $(window).scrollTop();
    var _direction;
    $(window).scroll(function(){
        var _cur_top = $(window).scrollTop();
        if(_top < _cur_top)
        {
            _direction = 'down';
        }
        else
        {
            _direction = 'up';
        }
        _top = _cur_top;
        console.log(_direction);
    });
});​

Comments

क्या jQuery ब्राउज़र मतभेदों को समाप्त करने के लिए नहीं है? आपके पास विभिन्न ब्राउज़रों के लिए विधियाँ क्यों हैं? क्या $('#elem').bind('scroll'यह पर्याप्त नहीं है? संपादित करें: कोई बात नहीं, मैंने आपका दूसरा उदाहरण देखा।

— रॉकेट हज़मत

हर बार थोड़ा देशी जावास्क्रिप्ट के साथ कुछ भी गलत नहीं है।

— एजीडीएम

क्या आपका मतलब नहीं है e.originalEvent.wheelDelta || e.originalEvent.detail?

— जैकबरोसडेव

चेतावनी: इस उत्तर में पहिया की घटनाएं गैर-मानक और पदावनत हैं। wheelघटना का उपयोग करें ।

— अलेक्जेंडर ओ'मैरा

मैं इस परीक्षण नहीं किया लेकिन MDN DOMMouseScroll के अनुसार अधिकांश ब्राउज़र में समर्थित नहीं है developer.mozilla.org/en-US/docs/Web/Events/DOMMouseScroll

— Liron Yahdav

Answer 3

window.addEventListener("scroll",function(){
    window.lastScrollTime = new Date().getTime()
});
function is_scrolling() {
    return window.lastScrollTime && new Date().getTime() < window.lastScrollTime + 500
}

अंतिम स्क्रॉल ईवेंट के बाद 500 मिलीसेकंड की संख्या में परिवर्तन करें, जिस पर आप उपयोगकर्ता को "अब स्क्रॉल नहीं करना" मानते हैं।

(इससे addEventListenerबेहतर है onScrollक्योंकि पूर्व उपयोग करने वाले किसी अन्य कोड के साथ अच्छी तरह से जुड़ सकता है onScroll।)

Answer 4

जाँच करने के लिए एक अंतराल का उपयोग करें

यदि आप उपयोगकर्ता को स्क्रॉल कर चुके हैं तो आप एक अंतराल सेट कर सकते हैं, फिर उसके अनुसार कुछ करें।

अपने लेख में महान जॉन रेजिग से उधार लेना ।

उदाहरण:

    let didScroll = false;

    window.onscroll = () => didScroll = true;

    setInterval(() => {
        if ( didScroll ) {
            didScroll = false;
            console.log('Someone scrolled me!')
        }
    }, 250);

लाइव उदाहरण देखें