<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Postpostmodern &#187; Javascript</title>
	<atom:link href="http://postpostmodern.com/tag/javascript/feed/" rel="self" type="application/rss+xml" />
	<link>http://postpostmodern.com</link>
	<description>Speaking of web development.</description>
	<lastBuildDate>Tue, 08 Jun 2010 18:46:31 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.1</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Global AJAX Cursor Change</title>
		<link>http://postpostmodern.com/instructional/global-ajax-cursor-change/</link>
		<comments>http://postpostmodern.com/instructional/global-ajax-cursor-change/#comments</comments>
		<pubDate>Tue, 06 Jan 2009 22:08:54 +0000</pubDate>
		<dc:creator>Jason Johnson</dc:creator>
				<category><![CDATA[Instructional]]></category>
		<category><![CDATA[AJAX]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Javascript]]></category>
		<category><![CDATA[jQuery]]></category>
		<category><![CDATA[UI]]></category>

		<guid isPermaLink="false">http://postpostmodern.com/?p=290</guid>
		<description><![CDATA[Two snippets to let users know when your web app is busy AJAXing.]]></description>
			<content:encoded><![CDATA[<p>I don&#8217;t know if I&#8217;ve ever mentioned this before, but in case I haven&#8217;t:</p>

<h2>Something to this effect should be used on all AJAX web pages:</h2>

<pre><code lang='javascript'>function globalAjaxCursorChange() 
{
  $("html").bind("ajaxStart", function(){
     $(this).addClass('busy');
   }).bind("ajaxStop", function(){
     $(this).removeClass('busy');
   });
}
</code></pre>

<p>Along with this CSS:</p>

<pre><code lang='css'>html.busy, html.busy * {
  cursor: wait !important;
}
</code></pre>

<p>The javascript above is jQuery, but I used to do the same type of thing back when I used Prototype.</p>

<p>Developers sometimes go to great lengths to supplement the native behavior of a system with custom &#8216;busy&#8217; indicators. And that&#8217;s great, but don&#8217;t forget what&#8217;s built-in. Users instinctively know that something&#8217;s working when they see the old hourglass/watch cursor.</p>
]]></content:encoded>
			<wfw:commentRss>http://postpostmodern.com/instructional/global-ajax-cursor-change/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
	</channel>
</rss>
