JQuery.load () के साथ एक div में सामग्री लोड हो रहा है, मैं लोड पर नई छवियों को कैसे फीका कर सकता हूं? जावास्क्रिप्ट, jquery, एचटीएमएल, छवि

मैं निम्नलिखित को प्राप्त करने की कोशिश कर रहा हूं: मेरे पास एक div है जिस पर मैं नई HTML सामग्री लाने के लिए लोड () विधि का उपयोग करता हूं।

 $("#mydiv").load("/newcontent.html");

इस नए HTML में छवियां भी हैं, और मैं चाहूंगा कि उन छवियों को एक बार लोड होने के बाद फीका कर दिया जाए।

पहले मैंने लोड () विधि के साथ कॉलबैक फ़ंक्शन का उपयोग करने की कोशिश की, लेकिन HTML के प्राप्त होते ही यह फ़ंक्शन चालू हो जाता है, लेकिन इससे पहले कि ब्राउज़र ने सभी नई छवियों को लोड कर दिया हो।

फिर मैंने सभी नए प्राप्त चित्रों पर एक ("लोड") घटना को लागू करने की कोशिश की, लेकिन यह बिल्कुल भी काम नहीं करता है।

$("#mydiv").load("/newcontent.html", function() {
$("#mydiv img").css("visibility","hidden").on("load", function() { $(this).fadeIn(); });
});

"दृश्यता: छिपी हुई "ठीक काम करती है, ताकि मेरी नई HTML सामग्री #mydiv में लोड हो जाए, और सभी चित्र अदृश्य में सेट हो जाएं। लेकिन लुप्त होती काम नहीं करता है। मैं जिस घटना को यहां बांधने की कोशिश कर रहा हूं वह वास्तव में जल्द से जल्द ट्रिगर करता है। नया HTML लोड किया गया है (जिसका मुझे कोई मतलब नहीं है), लेकिन तब नहीं जब व्यक्तिगत चित्र लोड किए गए हों।

इसे कैसे हल किया जा सकता है? किसी भी मदद की सराहना की!

उत्तर:

JQuery के fadeIn () और fadeOut () का उपयोग करें। और अगर आप लोड पर करना चाहते हैं तो उसके लिए घटना का उपयोग करें।