सीएसएस संक्रमण आसानी से काम नहीं कर

Question

ठीक है, तो मुझे समझ नहीं आता क्यों यह बाहर को कम नहीं करता है, केवल में: (त्वरित दृश्य के लिए, बस http://htmledit.squarefree.com में पेस्ट, उदाहरण के लिए)

<style> 
#over { 
background: url(http://th01.deviantart.net/fs71/150/f/2013/005/0/6/dal_shabet__have__don_t_have_by_awesmatasticaly_cool-d5qkzu8.jpg); 
height:150px; 
width:150px; 
} 

#in { 
background: url(http://www.mygrafico.com/images/uploads/thumbs/thumb_revidevi_CoolMonsterTruck.jpg); 
height:150px; 
width:150px; 
} 

#in:hover { 
opacity: 0; 
transition: opacity .3s ease-in-out; 
} 

</style> 

<div id="over"> 
<div id="in"></div 
</div> 

Answer 1

मुझे यकीन नहीं है कि आप वास्तव में क्या पूछ रहे हैं, लेकिन मुझे लगता है कि आप कह रहे हैं कि संक्रमण केवल माउस पर होता है, और जब आप माउस आउट नहीं करते हैं (यह सिर्फ उस समय तक वापस आ जाता है, जो इसके पहले था संक्रमण)। #in:hover की बजाय आपको अपनी संक्रमण संपत्ति #in पर जोड़नी होगी। संक्रमण केवल तब होता है जब आपका #in तत्व हो रहा है। #in के तहत संक्रमण के लिए सीएसएस को ले जाएं और यह माउस ओवर और माउस आउट पर काम करेगा। आप #in:hover के तहत होवर राज्य के लिए अपना वांछित सीएसएस छोड़ना चाहते हैं, इस मामले में, अस्पष्टता परिवर्तन, लेकिन वास्तविक संक्रमण सीएसएस संपत्ति #in के तहत जाएगी।

यह थोड़ा और अधिक स्पष्ट करने के लिए:

#in { 
    background: url(http://www.mygrafico.com/images/uploads/thumbs/thumb_revidevi_CoolMonsterTruck.jpg); 
    height:150px; 
    width:150px; 
    transition: opacity .3s ease-in-out; /* add this here */ 
} 

#in:hover { 
    opacity:0; 
    /* and we've removed it from here */ 
} 

बात पता करने के लिए आसानी-इन-बाहर के साथ जब यह संक्रमण करेंगे लेना देना नहीं है कि है। ऐसा लगता है कि आसानी से होवर पर है, और आसानी से माउसआउट पर है, लेकिन असल में, आसानी से बाहर निकलने का मतलब है कि यह आसानी से कुछ और आसानी से आसान हो जाएगा, जो आसानी से आसान है धीरे-धीरे संक्रमण में और फिर अंत की ओर गति। यह संक्रमण होने की बजाय ही संक्रमण की शैली से संबंधित है।

शायद आप इसे पहले ही समझ चुके हैं, लेकिन आपके प्रश्न के आधार पर ऐसा लगता है कि आप वहां उलझन में थे।

Answer 2

मैंने पाया कि @ वेल्बोर्नियो का जवाब मेरे लिए काम करता है, हालांकि आसानी से पहले-बाहर पूरी तरह से काम नहीं करता था। जब 'आईएमजी' पर लागू होता है तो आसानी से प्रभाव केवल काम करता है। मैंने पाया कि हर बार प्रभाव के लिए काम करने के लिए, मुझे आसानी से 'आईएमजी' और 'होवर' को आसानी से लागू करना पड़ा। मुझे यकीन नहीं है कि यह क्यों हो रहा था लेकिन अगर कोई भी एक ही मुद्दे में चलता है तो यह एक समाधान है।