jquery एनिमेट बनाम बनाम डिस्प्ले: कोई भी

Question

यदि किसी तत्व के पास डिस्प्ले है: सीएसएस में कोई भी नहीं, तो jQuery में 0 से 1 तक अस्पष्टता को एनिमेट करने से तत्व दिखाई नहीं देता है।

क्यों?

इसे देखने के लिए मुझे एनिमेट() में जोड़ने की क्या ज़रूरत है?

el.css({ 
      opacity: 0, 
      left: - 200 
      }).stop().animate({ 
      opacity: 1, 
      left: 0 
      }, { 
      duration: 333 
      }); 

Answer 1

आपको इसे पहले show()^[docs] विधि का उपयोग करके दिखाना होगा।

.css('opacity',0).show().animate({opacity:1}); 

उदाहरण::http://jsfiddle.net/DnE7M/1/

---

या फिर आप इस्तेमाल कर सकते हैं

अपने तत्व अस्पष्टता 0 पर पहले से ही नहीं है, तो आप शायद स्थापित करने के लिए है कि पहले चाहते हैं fadeIn()^[docs] विधि, जो display का भी ख्याल रखना चाहिए।

उदाहरण:http://jsfiddle.net/DnE7M/

---

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

el.css({ 
     opacity: 0, 
     left: - 200 
     }) 
    .stop() 
    .show()  // <-- make the element able to be displayed 
    .animate({ 
     opacity: 1, 
     left: 0 
     }, { 
     duration: 333 
     }); 

तुम भी सही कॉल में यह कर सकता है:यह कोड के लिए प्रासंगिक बनाने के सवाल को जोड़ा गया css()^[docs] विधि:

el.css({ 
     opacity: 0, 
     display: 'block', // <-- 'block' or whatever is appropriate for you 
     left: - 200 
     }) 
    .stop() 
    .animate({ 
     opacity: 1, 
     left: 0 
     }, { 
     duration: 333 
     });