fadeOut() और slideUp() एक ही समय में?

Question

मुझे jQuery: FadeOut then SlideUp मिला है और यह अच्छा है, लेकिन यह एक नहीं है।

मैं एक ही समय में fadeOut() और slideUp() कैसे कर सकता हूं? मैंने उसी विलंब के साथ दो अलग setTimeout() कॉल की कोशिश की लेकिन slideUp() पृष्ठ लोड होने के तुरंत बाद हुआ।

क्या किसी ने ऐसा किया है? सख्ती से एक fadeout लिए

$("#mySelector").animate({ height: 'toggle', opacity: 'toggle' }, 'slow'); 

:

Answer 1

आप कुछ इस तरह कर सकते हैं, यह एक पूर्ण टॉगल संस्करण है

$("#mySelector").animate({ height: 0, opacity: 0 }, 'slow'); 

Answer 2

मैं एक ऐसी ही समस्या थी और इस तरह यह तय हो गई।

$('#mydiv').animate({ 
      height: 0, 
     }, { 
      duration: 1000, 
      complete: function(){$('#mydiv').css('display', 'none');} 
     }); 
$('#mydiv').animate({ 
      opacity: 0, 
     }, { 
      duration: 1000, 
      queue: false 
     }); 

कतार संपत्ति यह बताता है एनीमेशन क़तार में किया जाए या बस इसे कुछ वेब पन्नों पर एक झटकेदार गति में अभी

Answer 3

सीधे एनिमेट ऊंचाई परिणाम खेलते हैं। हालांकि, jQuery के slideUp() के साथ एक सीएसएस संक्रमण संयोजन एक चिकनी गायब कार्य के लिए बनाता है। कोड के साथ

function slideFade(elem) { 
    var fade = { opacity: 0, transition: 'opacity 0.5s' }; 
    elem.css(fade).slideUp(); 
    } 

slideFade($('#mySelector')); 

फिडल: समाधान मैं dna.js परियोजना में इस्तेमाल जहां टॉगल के लिए अतिरिक्त सहायता देखने के लिए कोड (github.com/dnajs/dna.js) देख सकते हैं
http://jsfiddle.net/00Lodcqf

यह वह जगह है और कॉलबैक।

Answer 4

"निक क्रेवर" द्वारा स्वीकृत उत्तर निश्चित रूप से जाने का तरीका है। एकमात्र चीज जो मैं जोड़ूंगा वह यह है कि उसका जवाब वास्तव में इसे "छुपा" नहीं देता है, जिसका अर्थ है कि डोम अभी भी इसे प्रदर्शित करने के लिए व्यवहार्य तत्व के रूप में देखता है।

यदि आपके पास 'स्लीड' तत्व पर मार्जिन या पैडिंग है तो यह एक समस्या हो सकती है ... वे अभी भी दिखाए जाएंगे। तो मैं सिर्फ animate() फ़ंक्शन करने के लिए एक कॉलबैक जोड़ा वास्तव में इसे छिपाने के लिए एनीमेशन पूरा होने के बाद:

$("#mySelector").animate({ 
    height: 0, 
    opacity: 0, 
    margin: 0, 
    padding: 0 
}, 'slow', function(){ 
    $(this).hide(); 
}); 

Answer 5

@CodeKoalas के आधार पर वहाँ में एक और शोधन फेंकने। यह लंबवत मार्जिन और पैडिंग के लिए जिम्मेदार है लेकिन क्षैतिज नहीं है।

$('.selector').animate({ 
    opacity: 0, 
    height: 0, 
    marginTop: 0, 
    marginBottom: 0, 
    paddingTop: 0, 
    paddingBottom: 0 
}, 'slow', function() { 
    $(this).hide(); 
}); 

Answer 6

यह बहुत की तरह खुद को slideUp और fadeOut तरीकों के साथ ऐसा करना संभव है:

$('#mydiv').slideUp(300, function(){ 
    console.log('Done!'); 
}).fadeOut({ 
    duration: 300, 
    queue: false 
});