This requires jquery, the open overlay plugin and an ajax loader image and some css
ajaxAnim=function(close){ if (close){ setTimeout($.fn.openOverlay.closeOverlay,1000); //$.fn.openOverlay.closeOverlay(); return; } if($('#loaderImage').length){ ajaxAnim(1); ajaxAnim(0); } $('body').append('<div id="loaderImage"></div>'); $('#loaderImage').openOverlay(); }
ajaxAnim(); //opens ajax loader animation ajaxAnim(1); //closes ajax loader animation
example css:
#loaderImage{ width:50px; height:50px; background-color:white; background-image:url(../img/ajax-loader.gif); background-position:center center; background-repeat:no-repeat; -moz-box-shadow: 2px 3px 4px #666; -webkit-box-shadow: 2px 3px 4px #666; box-shadow: 2px 3px 4px #666; border:1px solid #333}