Hinnerup Net ApS, toying with Ajax spinners

Toggling of spinners inserted to the DOM in various ways.

Claimed to fail for hidden spinners in IE, these examples work in IE5.5, IE6, IE7, IE8b2, FF2, FF3, Safari 3.1.2, Opera 9, Opera 10 alpha and Chrome 1.0.

Example 1 | Example 2 | Example 3 | Example 4
Spinner is dynamically added to the DOM as visible but inside a hidden div.

  function spinIt() {
    jQuery("#theDiv").toggle();
  }
  jQuery(document).ready(function () {
    jQuery("#theInput").after("<div style='display:none; margin-top:1em;' id='theDiv'><img src='spinner4.gif' alt='Dynamically created spinner' /></div>");
  });
  // spinIt function is called when button is clicked

Author: Michael Schøler, michael@hinnerup.net, Hinnerup Net Aps, 2009

JavaScript verified with JSLint