function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion

Action Status Loading Image

I am using the below code to display a gif stored as a static resource to display the status of an AJAX update request. I want that the image be displayed in the middle of the page and the main page be unusable for that time.

<apex:page controller="exampleCon">
    <apex:form >
        <apex:outputText value="Watch this counter: {!count}" id="counter"/>
        <apex:actionStatus id="counterStatus" style="align:center;" >
            <apex:facet name="start" >
            <apex:image url="{!$Resource.loading}" height="50" width="50" />                       
        <apex:commandButton action="{!incrementCounter}" title="Click Me" rerender="counter"


public Global class exampleCon {

Integer count = 0;
public PageReference incrementCounter() {
return null;
public Integer getCount() {
return count;

 Thanks in advance!!


To put it in other words... I want the screen background be greyed out while the request is being processed


Thanks in advance