Have you seen the functionality of Show Processing when using a dynamic action with action: Submit page?
Well you can call that functionality anywhere with JavaScript. Using:

apex.widget.waitPopup();

when called it will add some div’s to your page which you have to remove manualy when your are done with your action.
Code for removall:

$(“#apex_wait_overlay”).remove();

$(“.u-Processing”).remove();

Or use it like this:

var loader;

loader = apex.widget.waitPopup();

loader.remove();

The best approach when using this in your application is to put the code in separate JavaScript functions because oracle might change some div id’s or widget functions.
When you put it inside a separate JavaScript function you don’t have to change it all over your application but just in that one JavaScript function. Let me show you an example when using it with an AJAX(apex.server.process) call.

apex.server.process(

    “Set product name”, {}, {

        dataType: ‘text’,

        beforeSend: function() {

            apex.widget.waitPopup();

        },

        success: function(pData) {

            setTimeout(function() {

                $s(“P6_PRODUCT_NAME”, pData);

                $(“#apex_wait_overlay”).remove();

                $(“.u-Processing”).remove();

            }, 2000);

        }

    });

setTimeout is used to simulate a 2 second AJAX call.

Demo using waitPopup() with an AJAX Call