IE रोक में एनिमेटेड GIF

Question

क्या आप किसी लिंक पर क्लिक करने या IE में पेज पर अपना फॉर्म सबमिट करने के बाद एनिमेटेड GIF को जारी रखने के लिए किसी काम के बारे में जानते हैं? यह अन्य ब्राउज़रों में ठीक काम करता है।

धन्यवाद।

Comments

यहाँ पर एकमात्र सही उत्तर @AnthonyWJones है। POST के लिए, वास्तविक सबमेट्स (ajax नहीं) कुछ भी काम नहीं करता है।

— पी। ब्रायन। मैके जू

वास्तव में यह बिल्कुल सच नहीं है। ऑनसाइट पोस्ट पर छवि दिखाने के लिए एक टाइमआउट का उपयोग करना फ़ॉर्म POST के साथ ठीक काम करता है।

— पुरानी छिपकली

@ P.Brian.Mackey - j.davis द्वारा समाधान ने मेरे लिए पोस्ट अनुरोध के लिए भी काम किया। हालाँकि हम भी सर्वर साइड विधि के लिए एक कॉल करने के लिए ajaxcontrol टूलकिट का उपयोग कर रहे हैं। यह उस मामले में काम नहीं करता है।

— अंकुर-एम

अद्यतन प्रगति के

— जिफ

जोर्डन के उत्तर की जाँच यहाँ करें । मुझे लगता है कि यह एक बेहतर समाधान है और यह डाउनलेवल IE पर भी काम करता है।

— जेसन क्रसोवेती

Answer 1

स्वीकृत समाधान मेरे काम नहीं आया।

कुछ और शोध के बाद मैं इस वर्कअराउंड में आया , और यह वास्तव में काम करता है।

यहाँ इसका सार है:

function showProgress() {
    var pb = document.getElementById("progressBar");
    pb.innerHTML = '<img src="./progress-bar.gif" width="200" height ="40"/>';
    pb.style.display = '';
}

और अपने HTML में:

<input type="submit" value="Submit" onclick="showProgress()" />
<div id="progressBar" style="display: none;">
    <img src="./progress-bar.gif" width="200" height ="40"/>
</div>

इसलिए जब फॉर्म जमा किया जाता है, तो <img/>टैग डाला जाता है, और किसी कारण से यह एनीमेशन के मुद्दों से प्रभावित नहीं होता है।

फ़ायरफ़ॉक्स, ie6, ie7 और ie8 में परीक्षण किया गया।

Comments

स्रोत: webproworld.com/graphics-design-discussion-forum/…

— j.davies

आपके कोड में आप वास्तव में कभी POST नहीं करते हैं। केवल "onclick =" जावास्क्रिप्ट कॉल। मैंने POST के साथ ऐसा करने की कोशिश की है जब आप सबमिट पर क्लिक करते हैं और यह काम नहीं करता है।

— पी। ब्रायन। मैके

जब तक आप अपने onclick के अंत में गलत नहीं लौट रहे हैं, सबमिट बटन एक POST को ट्रिगर करेगा। यही सबमिट बटन करते हैं।

— Frug

-1 यह जवाब गलत भी है। यह IE7 और IE8 gif छवि FREZEES में फॉर्म सबमिट करने के बाद काम नहीं करता है।

— मार्को डेमायो

यह मेरे लिए jQuery का उपयोग कर काम किया। हैक बहुत अजीब है, मुझे स्वीकार करना होगा। इस तरह से यह मेरे उदाहरण में काम किया: code<div id = "img_content"> <img id = 'aj_loader' src = 'आस्तियों / 2631.gif' शैली = "प्रदर्शन: कोई नहीं;" /> </ div> और फिर: code$ ( "# img_content") एचटीएमएल ($ ( "# img_content") एचटीएमएल ()।)।

— misaizdaleka

Answer 2

पुराने सवाल, लेकिन साथी गुगलों के लिए यह पोस्ट करना:

Spin.js इस उपयोग के मामले के लिए काम करता है: http://fgnass.github.com/spin.js/

Comments

सुधार, यह काम करता है लेकिन पेज लोड होने से पहले ही एनिमेट करना बंद कर देता है। तो अगर यह एक छोटा भार है तो यह मूल मुद्दे की तरह एनीमेशन जमा देता है।

— जेम्स मैकमोहन

महान समाधान, यानी 11 में ठीक काम तो अभी भी सभी को अद्यतित और समर्थित लगता है।

— एडम नाइट

spin.js दुर्भाग्य से काफी CPU गहन है। देखें मुद्दों / 8 , मुद्दों / 200 , मुद्दों / 215

— user247702

Spin.js मेरे लिए iPhone पर काम नहीं कर रहा है। जैसे ही पृष्ठ को दूसरे पर पुनर्निर्देशित किया जाता है, यह भी जम जाता है।

— अंकुर-एम

Answer 3

IE मानता है कि एक लिंक पर क्लिक करने से एक नया नेविगेशन शुरू होता है जहां वर्तमान पृष्ठ सामग्री को बदल दिया जाएगा। इसके लिए प्रक्रिया के भाग के रूप में यह GIF को एनिमेट करने वाले कोड को रोक देता है। मुझे संदेह है कि आप इसके बारे में कुछ भी कर सकते हैं (जब तक कि आप वास्तव में नेविगेट नहीं कर रहे हैं जिस स्थिति में ऑनक्लिक ईवेंट में झूठे का उपयोग करें)।

Comments

+1 - मैंने दोनों शीर्ष उत्तरों की कोशिश की। न काम करता है। मैं अपने सभी फॉर्म सबमिट नहीं करने जा रहा हूं।

— पी। ब्रायन। मैके जू

+1 मैं सहमत हूं, यह एकमात्र वास्तविक सही उत्तर है, केवल स्पिन.जेएस और कोडमोनकी वर्कअराउंड को छोड़कर।

— मार्को डेमायो

और अभी भी IE10 में

— चाड

और अभी भी IE11 में!

— बिलाज़ान

2017 की जाँच में!

— स्टीव वेकफोर्ड

Answer 4

यहाँ एक jsField है जो फॉर्म = "पोस्ट" के साथ फॉर्म सबमिट पर ठीक काम करता है। स्पिनर को फॉर्म सबमिट इवेंट में जोड़ा जाता है।

$("form").bind("submit", onFormSubmit);

function onFormSubmit() {
    setTimeout(showSpinner, 1);
}

function showSpinner() {
    $("body").append($('<img id="spinner" src="spinner.gif" alt="Spinner" />'));
}

यहां देखें jsFiddle कोड

इसे अपने IE ब्राउज़र में यहाँ टेस्ट करें

Comments

हां, यह बहुत अच्छा काम करता है (केवल IE 10 में अब तक परीक्षण किया गया है)। लेकिन मैं यह काम नहीं कर सकता कि जब मैं मेमोरी में इमेज को प्रीलोड करता हूं तो एनीमेशन को क्यों रोका जाता है। मैं आपके फिडल में प्रीलोड कर सकता हूं और यह ठीक काम करता है, सिर्फ मेरे कोड में नहीं, argh।

— साइमन ईस्ट

आपने कुछ गलत किया। :) स्पिनर छवि को अपने पेज पर एक img टैग के रूप में जोड़ें? मैंने url को अपडेट कर दिया है। मदद हो सकती है।

— पुराना छिपकली

IE यह सिर्फ एक झटका लगता है। पूर्व लोड होने पर एनीमेशन बंद कर देता है। जब jquery के माध्यम से इंजेक्शन लगाया जाता है, तो एनीमेशन साथ-साथ जारी रहेगा। इस समाधान के लिए धन्यवाद।

— एंथनी

Answer 5

मैं इस पोस्ट पर आया, और जब तक यह पहले ही उत्तर दिया जा चुका है, मुझे लगा कि मुझे कुछ जानकारी पोस्ट करनी चाहिए जो मुझे IE 10 के लिए इस समस्या के साथ मदद करती है, और इस तरह की समस्या के साथ दूसरों को इस पोस्ट पर पहुंचने में मदद कर सकती है।

मैं चकित था कि कैसे एनिमेटेड gif सिर्फ IE 10 में प्रदर्शित नहीं हो रहे थे और फिर इस रत्न को पाया।

Tools→ Internet Options→ Advanced→ MultiMedia→Play animations in webpages

उम्मीद है की यह मदद करेगा।

Comments

नहीं, कि IE11 में समस्या का समाधान नहीं है (लेकिन मदद करने की कोशिश के लिए +1)! :( वह है - मेरे पास यह विकल्प सक्षम है और एनिमेटेड GIF एनिमेटेड नहीं हैं, जब beforeunloadया unloadघटना में दिखाया गया है ।

— trejder

यह सवाल में उत्पन्न समस्या से कोई लेना-देना नहीं है।

— 14:24 पर user247702

Answer 6

मुझे इस समस्या का सामना तब करना पड़ा जब एक फॉर्म सबमिट करने की प्रक्रिया के दौरान लोडिंग जिफ़ दिखाने की कोशिश की जा रही थी। इसमें मज़े की एक और परत थी कि फॉर्म को सही करने के लिए एक ही ओनसुबमिट को एक सत्यापनकर्ता को चलाना था। हर किसी की तरह (इंटरनेट पर प्रत्येक IE / gif फॉर्म पोस्ट पर) मुझे IE में लोडिंग स्पिनर नहीं मिल सकता है (और, मेरे मामले में, फॉर्म को मान्य / सबमिट करें)। जबकि http://www.west-wind.com पर सलाह के माध्यम से मैं ev13wt द्वारा एक पोस्ट पाया कि समस्या का सुझाव दिया गया था "... कि IE छवि प्रदान नहीं करता है क्योंकि यह रेंडर किया गया था जब यह एनिमेटेड कारण था। " यह समझ में आया। उसका समाधान:

रिक्त छोड़ें जहां जिफ जाएगा और ऑनसुमिट समारोह में स्रोत सेट करने के लिए जावास्क्रिप्ट का उपयोग करेगा - document.getElementById ('loadingGif')। src = "gif file का पथ"।

यहां बताया गया है कि मैंने इसे कैसे लागू किया:

<script type="text/javascript">
    function validateForm(form) {

        if (isNotEmptyid(form.A)) {
            if (isLen4(form.B)) {        
                if (isNotEmptydt(form.C)) {
                    if (isNumber(form.D)) {        
                        if (isLen6(form.E)){
                            if (isNotEmptynum(form.F)) {
                                if (isLen5(form.G)){
                                    document.getElementById('tabs').style.display = "none";                
                                    document.getElementById('dvloader').style.display = "block";                
                                    document.getElementById('loadingGif').src = "/images/ajax-loader.gif"; 
                                    return true;
                                }
                            }
                        }
                    }
                }
            }
        }
        return false;   
    }               
</script>

<form name="payo" action="process" method="post" onsubmit="return validateForm(this)">
    <!-- FORM INPUTS... -->
    <input type="submit" name="submit" value=" Authorize ">

    <div style="display:none" id="dvloader">  
        <img id="loadingGif" src="" alt="Animated Image that appears during processing of document." />
        Working... this process may take several minutes.
    </div>

</form>

यह मेरे लिए सभी ब्राउज़रों में अच्छा काम करता है!

Comments

सेटिंग src मेरे लिए IE11 में भी काम किया। मेरे मामले में, यह पहले img html को पुनः जोड़ने के संयोजन में है। मुझे यकीन नहीं है कि मुझे दोनों की आवश्यकता क्यों है। यह ध्यान रखना दिलचस्प है कि मैं 'डिस्प्ले' (ब्लॉक करने के लिए) भी सेट कर रहा हूं, जैसा कि 'दृश्यता' को संशोधित करने के लिए है।

— Cfold

Answer 7

यहाँ मैंने क्या किया है। आपको केवल 10 चित्रों (इस मामले में मैंने शुरू किया 01.gifऔर समाप्त हुआ 10.gif) कहने के लिए अपनी जीआईएफ को तोड़ना है और उस निर्देशिका को निर्दिष्ट करना है जहां आप उन्हें रखते हैं।

HTML:

<div id="tester"></div>

जावास्क्रिप्ट:

function pad2(number) {   
    return (number < 10 ? '0' : '') + number 
}
var 
    dirURL = 'path/to/your/images/folder',
    ajaxLoader = document.createElement('img');
ajaxLoader.className = 'ajax-image-loader';
jQuery(document).ready(function(){
    jQuery('#tester').append(ajaxLoader);
    set(0);
});
function set(i) {
    if (i > 10) i = 1;    
    img.src = dirURL + pad2(i) + '.gif';
    setTimeout(function() {
        set(++i);
    }, 100);    
}

यह विधि IE7, IE8 और IE9 के साथ काम करती है (IE9 का आप उपयोग कर सकते हैं spin.js)। ध्यान दें: मैंने IE6 में यह परीक्षण नहीं किया है क्योंकि मेरे पास 60 के दशक से ब्राउज़र चलाने वाली कोई मशीन नहीं है, हालांकि यह विधि इतनी सरल है कि यह शायद IE6 और लोअर में भी काम करती है।

Comments

यह वर्कअराउंड काम करता है, जो स्पिन के एक ही सिद्धांत पर आधारित है, जेएस मूल रूप से एक GIF एनीमेशन का अनुकरण करने के लिए जेएस सेटटाइमआउट का उपयोग करता है।

— मार्को डेमायो

Answer 8

इससे संबंधित मुझे एक फिक्स ढूंढना था जहां स्टाइलिंग को बनाए रखने के लिए एनिमेटेड gifs को बैकग्राउंड इमेज के रूप में इस्तेमाल किया गया था। इसी तरह का एक फ़िक्स मेरे लिए भी वहाँ काम करता था ... मेरी स्क्रिप्ट कुछ इस तरह से चली (मैं jQuery का उपयोग कर रहा हूँ ताकि गणना की गई पृष्ठभूमि शैली को प्राप्त करना आसान हो - कैसे करें कि jQuery के बिना किसी अन्य पोस्ट के लिए एक विषय है):

var spinner = <give me a spinner element>

window.onbeforeunload = function() {
  bg_image = $(spinner).css('background-image');
  spinner.style.backgroundImage = 'none';
  spinner.style.backgroundImage = bg_image;
}

[संपादित करें] थोड़े और परीक्षण के साथ मैंने महसूस किया है कि यह IE8 में पृष्ठभूमि छवियों के साथ काम नहीं करता है। मैं सब कुछ करने की कोशिश कर रहा हूँ मैं एक पृष्ठ लोड करने के लिए एक gif एनीमेशन wile रेंडर करने के लिए IE8 प्राप्त करने के लिए सोच सकता हूं, लेकिन यह इस समय संभव नहीं दिखता है।

Comments

आप jQuery ( $(spinner).css('background-image')) का उपयोग करके CSS कोड क्यों पढ़ रहे हैं , लेकिन इसे उसी तरह सेट करने के बजाय, आप शुद्ध जावास्क्रिप्ट तरीका ( spinner.style.backgroundImage) का उपयोग कर रहे हैं । आपका कोड मेरे लिए किसी भी ब्राउज़र में काम नहीं कर रहा है। अगर मैं सीधे आपके कोड का उपयोग करता हूं, तो मुझे cannot set backgroundImage property of undefinedत्रुटि हो रही है। अगर मैं jQuery का उपयोग करके CSS को सेट करने के लिए आपका कोड बदलता हूं, तो कोड बिना किसी त्रुटि के चलता है, लेकिन छवि रीसेट नहीं होती है और div / spinner तत्व खाली रहता है। मुझे नहीं पता, क्यों?

— trejder

सत्यापित ! कोई मौका नहीं है, आपका कोड काम करेगा। कोई ब्राउज़र है नहीं सेट करने के लिए (दिसंबर 2014 तक) में सक्षमbackground-imageमें संपत्तिunloadयाbeforeunloadघटनाओं। देखें इस सवाल या इस jsFiddle जानकारी के लिए।

— trejder

Answer 9

@Danfolkes के उत्तर पर बिल्डिंग, इसने मेरे लिए IE 8 और ASP.NET MVC3 में काम किया।

हमारे _Layout.cshtml में

<body style="min-width: 800px">
    <div id="progress">
        <div style="min-height: 200px">
        </div>
        <div id="throbber">
            <img src="..\..\Content\ajax-loader.gif" alt="Progress" style="display: block;
                margin-left: auto; margin-right: auto" />
        </div>
    </div>
    <div id="main">

<<< सामग्री यहाँ >>> ...

<script type="text/javascript" language="javascript">
    function ShowThrobber() {
        $('#main').hide();
        $('#progress').show();
        // Work around IE bug which freezes gifs
        if (navigator.appName == 'Microsoft Internet Explorer') {
            // Work around IE bug which freezes gifs
            $("#throbber").html('<img src="../../Content/ajax-loader.gif" alt="Progress" style="display: block; margin-left: auto; margin-right: auto"/>');
         }
</script>
<script type="text/javascript" language="javascript">
    function HideThrobber() {
        $('#main').show();
        $('#progress').hide();
    }
</script>
<script type="text/javascript" language="javascript">
    $(document).ready(function () {
        HideThrobber();
    });
</script>

और हमारे नेविगेशन लिंक में:

<input type="submit" value="Finish" class="submit-link" onclick="ShowThrobber()"/>

या

@Html.ActionLink("DoSometthing", "MyController", new { Model.SomeProperty }, new { onclick = "ShowThrobber()" })

Answer 10

इस समाधान को http://timexwebdev.blogspot.com/2009/11/html-postback-freezes-animated-gifs.html पर मिला और यह काम करता है! बस दृश्य में सेट करने से पहले छवि को फिर से लोड करें। अपने बटन के ऑन्कलिक से निम्नलिखित जावास्क्रिप्ट फ़ंक्शन को कॉल करें:

function showLoader()
{
   //*** Reload the image for IE ***
   document.getElementById('loader').src='./images/loader.gif';
   //*** Let's make the image visible ***
   document.getElementById('loader').style.visibility = 'visible';
}

Answer 11

मुझे पता है कि यह एक पुराना सवाल है और अब तक मूल पोस्टरों में से प्रत्येक ने एक समाधान पाया है जो उनके लिए काम करता है, लेकिन मैंने इस मुद्दे पर भाग लिया और पाया कि वीएमएल टैग इस IE बग का शिकार नहीं होते हैं। VML टैग का उपयोग करके IE ब्राउज़र पर रखे जाने पर एनिमेटेड GIF अभी भी पेज अनलोड के दौरान चलते हैं।

ध्यान दें, मैंने VML का पता लगाने से पहले VML टैग का उपयोग करने का निर्णय लिया था, इसलिए यह सामान्य एनिमेटेड GIF व्यवहार का उपयोग करके फ़ायरफ़ॉक्स और अन्य ब्राउज़रों में काम कर रहा है।

यहां मैंने इसे हल किया है।

<input class="myExitButton" type="button" value="Click me"  />

<div class="loadingNextPage" style="display:none" >
    <span style="left:-24px; POSITION: relative; WIDTH: 48px; DISPLAY: inline-block; HEIGHT: 48px" class="spinnerImageVml"><?xml:namespace prefix="rvml" ns = "urn:schemas-microsoft-com:vml" /><rvml:group style="POSITION: absolute; WIDTH: 48px; HEIGHT: 48px; rotation: 1deg" class="rvml" coordsize = "47,47"><rvml:image style="POSITION: absolute; WIDTH: 48px; HEIGHT: 48px; TOP: 0px; LEFT: 0px" class="rvml" src="/images/loading_gray.gif" coordsize="21600,21600"></rvml:image></rvml:group></span>
    <img class="spinnerImage" src="/images/loading_gray.gif" alt="loading..." />
    <div>Just one moment while we access this information...</div>
</div>

<script language="javascript" type="text/javascript">
    window.LoadProgress = (function (progress, $) {

        var getdialogHeight = function (height) {
            var isIE = navigator.userAgent.toLowerCase().indexOf('msie') > -1;
            if (isIE) {
                return height + 'px';
            }
            return height;
        };

        var isVmlSupported = function () {
            var a = document.body.appendChild(document.createElement('div'));
            a.innerHTML = '<v:shape id="vml_flag1" adj="1" />';
            var b = a.firstChild;
            b.style.behavior = "url(#default#VML)";
            var supported = b ? typeof b.adj == "object" : true;
            a.parentNode.removeChild(a);
            return supported;
        };

        var showAnimationDuringPageUnload = function () {
            if (isVmlSupported()) {
                $(".loadingNextPage > .spinnerImage").hide();
            }
            else {
                $(".loadingNextPage > .spinnerImageVml").hide();
            }
        };

        var openLoadingMessage = function () {
            $(".loadingNextPage").dialog({
                modal: true,
                closeOnEscape: true,
                title: 'Please wait...',
                closeText: 'x',
                height: getdialogHeight(200),
                buttons: {
                    "Close": function () {
                        $(this).dialog("close");
                    }
                }
            });
        };

        $('.myExitButton').click(function () {
            openLoadingMessage();
            showAnimationDuringPageUnload();
            window.location.href = 'http://www.stackoverflow.com';
        });


        return progress;
    })(window.LoadProgress || {}, window.jQuery);
</script>

स्वाभाविक रूप से, यह jQuery, jQueryUI पर निर्भर करता है और इसके लिए कुछ प्रकार के एनिमेटेड GIF की आवश्यकता होती है ("/images/loading_gray.gif")।

Answer 12

jQuery:

$("#WhereYouWantTheImageToAppear").html('<img src="./Animated.gif" />');

Answer 13

बस इसी तरह का मुद्दा था। ये मेरे लिए पूरी तरह से काम करते थे।

$('#myElement').prepend('<img src="/path/to/img.gif" alt="My Gif" title="Loading" />');

$('<img src="/path/to/img.gif" alt="My Gif" title="Loading" />').prependTo('#myElement');

एक अन्य विचार jQuery का .लोड () का उपयोग करना था; लोड करने के लिए और फिर इमेज को प्रीपेन्ड करें।

IE 7+ में काम करता है

Answer 14

बहुत, बहुत देर हो गई इस एक का जवाब देने के लिए, लेकिन मैंने अभी-अभी पता लगाया है कि एक पृष्ठभूमि-छवि का उपयोग करके जो CSS में base64 URI के रूप में एन्कोडेड है, एक अलग छवि के रूप में आयोजित होने के बजाय, IE8 में चेतन करना जारी रखता है।

Answer 15

एक बहुत ही आसान तरीका jQuery और SimpleModal प्लगइन का उपयोग करना है । फिर जब मुझे सबमिट पर अपना "लोडिंग" जीआईएफ दिखाना होगा, तो मैं करता हूं:

$('*').css('cursor','wait');
$.modal("<table style='white-space: nowrap'><tr><td style='white-space: nowrap'><b>Please wait...</b></td><td><img alt='Please wait' src='loader.gif' /></td></tr></table>", {escClose:false} );

Answer 16

मुझे यही समस्या थी, फ़ायरफ़ॉक्स जैसे अन्य बॉरोवर्स के लिए भी आम। अंत में मुझे पता चला कि डायनामिक रूप से एनिमेटेड जिफ के साथ एक तत्व बनाते हैं जो फॉर्म सबमिट नहीं होता है, इसलिए मैंने निम्नलिखित वर्कऑरंड को विकसित किया है।

1) document.ready()प्रत्येक FORM पृष्ठ में पाया जाता है, position:relativeसंपत्ति प्राप्त करता है और फिर प्रत्येक को एक अदृश्य संलग्न किया जाता है DIV.bg-overlay।

2) इसके बाद, यह मानते हुए कि मेरी वेबसाइट के प्रत्येक सबमिट मूल्य को btn-primarycss वर्ग द्वारा पहचाना जाता है , फिर से document.ready(), मैं इन बटनों की तलाश करता हूं, प्रत्येक के FORM माता-पिता के लिए ट्रैवर्स, और फॉर्म सबमिट करते समय, मैं आग showOverlayOnFormExecution(this,true);कार्य करता हूं , क्लिक किया गया बटन और एक बूलियन जो दृश्यता को टॉगल करता है DIV.bg-overlay।

$(document).ready(function() {

  //Append LOADING image to all forms
  $('form').css('position','relative').append('<div class="bg-overlay" style="display:none;"><img src="/images/loading.gif"></div>');

  //At form submit, fires a specific function
  $('form .btn-primary').closest('form').submit(function (e) {
    showOverlayOnFormExecution(this,true);
  });
});

सीएसएस DIV.bg-overlayनिम्नलिखित है:

.bg-overlay
{
  width:100%;
  height:100%;
  position:absolute;
  top:0;
  left:0;
  background:rgba(255,255,255,0.6);
  z-index:100;
}

.bg-overlay img
{
  position:absolute;
  left:50%;
  top:50%;
  margin-left:-40px; //my loading images is 80x80 px. This is done to center it horizontally and vertically.
  margin-top:-40px;
  max-width:auto;
  max-height:80px;
}

3) किसी भी फॉर्म सबमिट करने के बाद, निम्न फ़ंक्शन को एक अर्ध-श्वेत पृष्ठभूमि ओवरले को दिखाने के लिए निकाल दिया जाता है (जो फॉर्म के साथ फिर से बातचीत करने की क्षमता से इनकार करता है) और उसके अंदर एक एनिमेटेड जिफ (जो नेत्रहीन एक लोडिंग एक्शन दिखाता है)।

function showOverlayOnFormExecution(clicked_button, showOrNot) 
{
    if(showOrNot == 1)
    {
        //Add "content" of #bg-overlay_container (copying it) to the confrm that contains clicked button 
        $(clicked_button).closest('form').find('.bg-overlay').show();
    }
    else
        $('form .bg-overlay').hide();
}

फॉर्म जमा में एनिमेटेड जिफ दिखाते हुए, इस घटना में इसे शामिल करने के बजाय, विभिन्न ब्राउज़रों की "जिफ एनिमेशन फ्रीज" समस्या को हल करता है (जैसा कि कहा गया है, मुझे यह समस्या आईई और फ़ायरफ़ॉक्स में मिली थी, क्रोम में नहीं)