Posted By

smchristensen on 12/18/10


Tagged

jquery webdesign throbber


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

jillella


Binding throbber div for jQuery AJAX requests


 / Published in: jQuery
 

jQuery bindings for showing and hiding a div during AJAX requests. The div will not show unless the AJAX request takes a certain amount of time (in this case 300ms). This will reduce the flicker effect of showing and hiding throbbers.

  1. $('#loading').bind('ajaxStart', function() {
  2. var n = $(this);
  3. n.data('state', 'started');
  4. setTimeout(function() {
  5. if (n.data() && n.data().state == 'started') {
  6. n.slideDown(500);
  7. }
  8. }, 300);
  9. }).bind('ajaxStop', function() {
  10. var n = $(this);
  11. n.data('state', 'stopped');
  12. n.slideUp(500);
  13. });

Report this snippet  

You need to login to post a comment.