1. Home
  2. Website Design
  3. Portfolio
  4. eCommerce
  5. Web Optimisation
  6. Website Video
  7. Graphic Design
  8. Blog
  9. Team
  10. Contact

Print This Page
Print this page.

Website Design: JQuery Animation Showcase

Posted on on Wednesday, January 27th, 2010 at 6:21 pm.

Following on with the JQuery theme,  I’d like to take this opportunity to showcase, some excellent examples of JQuery within Website Design.  Now any body who has come across, or indeed used, snippets of JQuery before will be more than aware of it’s most common uses, such content sliders, galleries, form validation, content section to name a few.

I will be not only bringing you great examples of these common uses, but how a little imagination can really enhance your website design.

1. Website Curtain Call

This is a very clever bit of JQuery that uses basic animation modules to reduce the size of the divs. The clever part is that the background of these DIV condenses to give the illusion if the curtains being pulled back.

Website Design JQuery Showcase 1

http://buildinternet.com/live/curtains/

2. Robotic Website Design

As well as it’s many user experience design features, JQuery is also building a reputation for slick, seamless animation, previously only achievable by using Flash. This next example is a cracking example of what I mean.

Website Design JQuery Showcase 1

http://robot.anthonycalzadilla.com/

3. The Gravitational Pull of Design

This superb JQuery showcase, simulates the pull of gravity. I’m sure it’s quite possible to feature some great uses for this one.

Website Design JQuery Showcase 3

http://themeforest.s3.amazonaws.com/74_jquery/jquerygravitysource/index.html

4. Unveil Your Content

A common use of the might JQ is to show and hide content, without losing the SEO power. So with this in mind, you can apply this to your website design with a little more flair.

Website Design JQuery Showcase 4

http://buildinternet.com/live/landscape-header/landscape-header.htm

5. Subtle is the Secret!

For the last an final example of this showcase, and in my opinion the Pièce de résistance, this very subtle effect which has caused much attention, if you follow this link, you’ll also get their very own text on how they’ve applied this within their Website Design

Website Design JQuery Showcase 5

http://youlove.us/blog/the-youloveus-scrolling-background-effect-explained

Related Posts

Leave a Reply

Bookmark and Share Creare

Twitter
twitter.com/crearegroup

Recent Blog Comments

  1. Craig Riches: Hi, I like the w...
  2. Myles: Congratulations!...
  3. Square One: Cool post - very...
  4. Pete: Over on the Tips...
  5. Alex: A useful list of...

Latest Web Design Blog

Web Design: Styling forms with CSS
Posted on Tue, 09 Mar 2010

James proposes a good method for styling your forms using CSS, W3C compliant code and as few elements as possible. Read this tutorial and start making some nicely laid out forms!