Skip to content

Rob's Blog

for the win

Recent Posts

  • Want to Spread an Idea Fast? Describe it with Software.
  • Mobile Automated Fluid Dispenser that Accepts Bitcoin as Payment Mechanism
  • Swartz vs Snowden OR Resist Restrictions that Seem Arbitrary or Capricious
  • Steve Jobs on Loyalty
  • Rockonomics

Recent Comments

  • jfoster on Substitute Tool for IKEA Malm Bed Frame and Desk
  • Gareth on Substitute Tool for IKEA Malm Bed Frame and Desk
  • Fay on Substitute Tool for IKEA Malm Bed Frame and Desk
  • John on Substitute Tool for IKEA Malm Bed Frame and Desk
  • joanna on Substitute Tool for IKEA Malm Bed Frame and Desk

Archives

  • June 2014
  • August 2013
  • July 2013
  • June 2013
  • May 2013
  • April 2013
  • January 2013
  • November 2012
  • July 2012
  • July 2011
  • December 2010
  • September 2010
  • August 2010
  • July 2010
  • June 2010
  • May 2010
  • April 2010
  • March 2010
  • February 2010
  • January 2010
  • December 2009
  • June 2009
  • May 2009
  • April 2009
  • March 2009
  • January 2009
  • December 2008
  • November 2008
  • October 2008
  • September 2008
  • August 2008
  • July 2008
  • May 2008
  • April 2008
  • March 2008
  • February 2008
  • January 2008
  • November 2007
  • October 2007
  • July 2007
  • June 2007
  • April 2007
  • March 2007
  • February 2007
  • January 2007
  • December 2006
  • November 2006
  • October 2006
  • June 2006
  • May 2006
  • April 2006
  • March 2006
  • January 2006
  • December 2005
  • November 2005
  • April 2005

Categories

  • advertising
  • api
  • app store
  • Apple
  • art
  • Babson
  • bitcoin
  • blogging
  • companies
  • concerts
  • css
  • design
  • education
  • energy
  • entertainment
  • environment
  • ethics
  • facebook
  • family
  • fashion
  • fbml
  • food
  • furniture
  • gadget
  • gaming
  • google
  • html
  • humor
  • iOS
  • ipad
  • iphone
  • iPhone SDK
  • islate
  • itunes
  • legal
  • marketing
  • mobile computing
  • movies
  • moving
  • music
  • nsfw
  • Obama
  • P2P
  • philosophy
  • photoshop
  • podcastinople
  • politics
  • privacy
  • programming
  • projects
  • Rainbow Gathering
  • remix
  • salesforce
  • sdk
  • selling
  • Society
  • song of the month
  • space
  • sports
  • technology
  • transportation
  • travel
  • twitter
  • unlock
  • video games
  • vista
  • weekly davespeak
  • windows
  • WoW
  • www
  • xp
  • zune

Meta

  • Log in
  • Entries RSS
  • Comments RSS
  • WordPress.org

Tag: action cueing

Display a Simple Loading Message and Animated Loading Gif Using JavaScript

Some pages require an inordinate amount of time to load.  For most sites, this is a big problem.  Webmasters and SEO specialists know the value of a quick landing page load, because they know that netizens have short attention spans.

Dynamically built webpages, (especially applications), require time to load and visual feedback that something is happening.  The most famous example is the gmail loading page:

Loading Message and Animated Gif Example Javascript

Gmail uses a more sophisticated progress bar to represent the loading of the webpage.  I found an article on yensDesign that gives some great advice on how to do this, if you want to get really fancy.

If you have a dynamically built page that you’d like to give a loading message to that doesn’t require a full progress bar, I recommend simply displaying a message and an animated gif.

The Method

The trick to accomplishing this is a small mix of JavaScript and CSS.  You don’t have to be using <div>’s to display your content, but you should.  My example uses <div>’s. Continue reading Display a Simple Loading Message and Animated Loading Gif Using JavaScript

Posted on May 20, 2009Categories css, design, programming, wwwTags action cueing, dynamic webpages, visual feedback5 Comments
Proudly powered by WordPress