Acid.JS Web 2.0 Component Library

AJAX Loading Panel 4.0

Enhance your site's look and feel during AJAX requests with the fully customizable state-of-the art LoadingPanel.JS without writing a single line of code!

LoadingPanel.JS allows you to display cool loading overlay to your webpages during your async requests to the server. The loading overlay ann message is fully customizable and can fit to any website design. The deployment and customization of the script is a matter of minutes.

If you have missed the onload demo, click here to simulate AJAX request and show LoadingPanel.JS.

Client Methods of LoadingPanel.JS

  • After you have registered the required scripts on the page, use the ajaxloadingpanel.init() method to initialize LoadingPanel.JS on the page as shown below. Please, refer to the manual included in the distribution of the control for detailed information about the client methods and properties. Notice that this method will render a hidden loading panel on the page. To control an already instantiated panel on the page, use the ajaxloadingpanel.show() and ajaxloadingpanel.hide() methods of the component.
    
    ajaxloadingpanel.init({
    	scriptsroot: '',
    	overlay: "#000",
    	text: "Contacting Server. Please, wait...",
    	font: "bold 12px 'Segoe UI', 'Trebuchet MS', Arial, Verdana, Serif",
    	color: "#fff",
    	textalign: "center",
    	msgwidth: "240",
    	msgheight: "46",
    	msgbackground: "#ff8000",
    	borderradius: "large",
    	borderdithercolor: "#777",
    	spinnerposition: "center",
    	overlayopacity: "6",
    	spinnerurl: "Loading_02.gif",
    	roundedcorners: "true, true, true, true"
    });
  • To display the loading panel when needed (for example - during an AJAX call), use the following method:
    
    	ajaxloadingpanel.show();
  • To hide the loading panel when needed (for example - after an AJAX call), use the following method:
    
    	ajaxloadingpanel.hide();

Create Custom Loading Indicators

Browser Support

LoadingPanel.JS works with all major browsers, Including Internet Explorer 6.

  • Internet Explorer 6
  • Internet Explorer 7
  • Internet Explorer 8
  • Mozilla FireFox
  • Opera
  • Google Chrome
  • Apple afari

Requirements and Troubleshooting

LoadingPanel.JS requires that the page it is used on is in standards compliance mode (XHTML1.0/1.1 or HTML5). Quriks mode is not supported. Please, refer to the manual included in the distribution of the control for detailed information about the client methods and properties of LoadingPanel.JS.

Differences Between the Lite and the Full Version

The Lite version of LoadingPanel.JS is displays a trial message at the top of the page. If you wish to have that message removed, please, purchase the script for USD20 on the following page.