विलंब jquery मंडराना घटना?

Question 1

मैं jquery में एक मंडराना घटना में देरी करना चाहूंगा। जब उपयोगकर्ता किसी लिंक या लेबल पर घूमता है तो मैं एक फ़ाइल से पढ़ रहा होता हूं। मैं नहीं चाहता कि यह घटना तुरंत घटित हो, जब उपयोगकर्ता केवल माउस को स्क्रीन पर घुमा रहा है। क्या फायरिंग से घटना में देरी करने का कोई तरीका है?

धन्यवाद।

उदाहरण कोड:

$(function() {
    $('#container a').hover(function() {
        $('<div id="fileinfo" />').load('ReadTextFileX.aspx',
            {filename:'file.txt'},
            function() {
                $(this).appendTo('#info');
            }
         );
    },
        function() { $('#info').remove(); }
    });
});

अद्यतन: (1/14/09) HoverIntent प्लगइन को जोड़ने के बाद उपरोक्त कोड को इसे लागू करने के लिए निम्नलिखित में बदल दिया गया था। लागू करने के लिए बहुत सरल है।

$(function() {
    hiConfig = {
        sensitivity: 3, // number = sensitivity threshold (must be 1 or higher)
        interval: 200, // number = milliseconds for onMouseOver polling interval
        timeout: 200, // number = milliseconds delay before onMouseOut
        over: function() {
            $('<div id="fileinfo" />').load('ReadTextFileX.aspx', {filename:'file.txt'},
                function() {
                   $(this).appendTo('#info');
                }
             );
        }, // function = onMouseOver callback (REQUIRED)
        out: function() { $('#info').remove();  } // function = onMouseOut callback (REQUIRED)
    }
    $('#container a').hoverIntent(hiConfig)
}

Question 2

Jquery के लिए hoverIntent प्लगइन का उपयोग करें: http://cherne.net/brian/resources/jquery.hoverIntent.html

यह बिल्कुल सही है कि आप क्या वर्णन करते हैं और मैंने इसे लगभग हर परियोजना पर उपयोग किया है जो मेनू आदि के माउसओवर सक्रियण की आवश्यकता है ...

इस दृष्टिकोण के लिए एक गेटा है, कुछ इंटरफेस एक 'होवर' राज्य से रहित हैं। iPhone पर सफारी जैसे मोबाइल ब्राउज़र। आप इंटरफ़ेस या नेविगेशन का एक महत्वपूर्ण हिस्सा छिपा सकते हैं, इस तरह के डिवाइस पर इसे खोलने का कोई तरीका नहीं है। आप डिवाइस विशिष्ट सीएसएस के साथ इसे गोल कर सकते हैं।

Question 3

आपको हॉवर पर एक टाइमर की जांच करने की आवश्यकता है। यदि यह मौजूद नहीं है (यानी यह पहला होवर है), तो इसे बनाएं। यह मौजूद है (यानी यह है नहीं घूमें), यह मारने और उसे पुन: प्रारंभ। अपने कोड के लिए टाइमर पेलोड सेट करें।

$(function() {
    var timer;

    $('#container a').hover(function() {
        if(timer) {
            clearTimeout(timer);
            timer = null
        }
        timer = setTimeout(function() {
            $('<div id="fileinfo" />').load('ReadTextFileX.aspx',
                {filename:'file.txt'},
                function() {
                    $(this).appendTo('#info');
                }
            );
        }, 500)
    },
    // mouse out
    });
});

मुझे यकीन है कि jQuery के पास एक फ़ंक्शन है जो आपके लिए यह सब लपेटता है।

संपादित करें : आह हां, बचाव के लिए jQuery प्लगइन

Question 4

पूरी तरह से सहमत हैं कि hoverIntent सबसे अच्छा समाधान है, लेकिन अगर आप एक दुर्भाग्यपूर्ण वतन हो जाते हैं, जो एक वेबसाइट पर काम करता है जो jQuery प्लगइन्स के अनुमोदन के लिए एक लंबी और लंबी प्रक्रिया है, तो यहां एक त्वरित और गंदा समाधान है जो मेरे लिए अच्छा काम करता है:

$('li.contracted').hover(function () {
    var expanding = $(this);
    var timer = window.setTimeout(function () {
        expanding.data('timerid', null);

            ... do stuff

    }, 300);
    //store ID of newly created timer in DOM object
    expanding.data('timerid', timer);
}, function () {
    var timerid = $(this).data('timerid');
    if (timerid != null) {
        //mouse out, didn't timeout. Kill previously started timer
        window.clearTimeout(timerid);
    }
});

यह केवल एक <li> का विस्तार करने के लिए है अगर माउस उस पर 300ms से अधिक समय तक रहा हो।

Question 5

आप माउसआउट ईवेंट पर क्लियरटाइमआउट () के साथ सेटटाइमआउट () कॉल का उपयोग कर सकते हैं।

Question 6

2016 में क्रिसेंट फ्रेश का घोल मेरे लिए उम्मीद के मुताबिक काम नहीं कर पाया, इसलिए मैं इसके साथ आया:

$(selector).hover(function() {
    hovered = true;
    setTimeout(function() {
        if(hovered) {
            //do stuff
        }
    }, 300); //you can pass references as 3rd, 4th etc. arguments after the delay

}, function() {
    hovered = false;
});

Question 7

मेरा समाधान आसान है। यदि उपयोगकर्ता 300 मीटर से अधिक की गति पर माउस को रख रहा हो तो खुला मेनू:

var sleep = 0;
$('#category li').mouseenter(function() {
    sleep = 1;
    $('#category li').mouseleave(function() {
        sleep = 0;
    });
    var ob = $(this);
    setTimeout(function() {                         
        if(sleep) {
            // [...] Example:
            $('#'+ob.attr('rel')).show();
        }
    }, 300);
});