clipped from: Monday, July 10th, 2006
Ajax Activity Indicators Examples
Category: Component
, Prototype, Examples
Ian Selby has written a thorough article on ajax activity indicators - make them globel and unobtrusive.
Ian details his solution:
So, what can we do about these problems? Well, if you’re using prototype as a part of your framework, you can register global indicator functions. These get executed when there are active requests, and when the requests complete. However, there’s another dilemma with this method too: Where do you place a indicator that can potentially appear often and keep it from being obtrusive, or, even worse, not being seen as it’s placed outside of the content that’s currently in view? I had to tackle that issue this week while starting development on a new project at work. I wanted to create an indicator that would be in the same place on every page, and that I never had to write extra code to use.
Code Example
onCreate: function() {
if($('notification') && Ajax.activeRequestCount> 0)
Effect.Appear('notification',{duration: 0.25, queue: 'end'});
},
onComplete: function() {
if($('notification') && Ajax.activeRequestCount == 0)
Effect.Fade('notification',{duration: 0.25, queue: 'end'});
}
});
