jQuery ड्रॉपडाउन स्लाइड को

Question

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

$(document).ready(function() { 
    $("li#navi-dropdown").hover(
    function() { 
     $('ul.nav-dropdown').slideDown('medium'); 
    }, 
    function() { 
     $('ul.nav-dropdown').slideUp('medium'); 
    } 
); 
}); 

शायद कुछ आसान है, लेकिन सहायता का स्वागत है। नीचे JSFiddle।

http://jsfiddle.net/6e87Lwkb/

Answer 1

अपने ली के अंदर अपने उल सबमेनू डालने पर विचार करें, और इसका स्थान बदलना:

यहाँ मेरी बेला है। इतनी के रूप में jQuery अपनी स्लाइड्स एनिमेशन कतार नहीं है भी .stop उपयोग करने के लिए मत भूलना मत(),:

$('ul.nav-dropdown').stop().slideDown('medium'); 

See your updated fiddle here

Answer 2

तुम मुझे हैंडलर में घटना toggeling कर रहे हैं, तो आप इस सब करने की ज़रूरत:

$(document).ready(function() { 
    $("li#navi-dropdown").on('mouseover',function() { 
    $('ul.nav-dropdown').slideDown('medium'); 
    }) 

    $("ul.nav-dropdown").on('mouseleave',function() { 
    $('ul.nav-dropdown').slideUp('medium'); 
    }); 
}); 

मैं भी अपने बेला अद्यतन किया है, यह बाहर की जाँच अब यह काम करता है।

http://jsfiddle.net/6e87Lwkb/7/

Answer 3

इस कोड के साथ प्रयास करें।

$(document).ready(function() { 
    $("li#navi-dropdown").hover(
    function() { 
    $('ul.nav-dropdown').slideDown('medium'); 
    }); 
    $(".nav-dropdown").mouseleave(
    function() { 
    $('ul.nav-dropdown').slideUp('medium'); 
    }); 
});