02.06.2013 Views

jQuery 1.4 Animation Techniques - Index of

jQuery 1.4 Animation Techniques - Index of

jQuery 1.4 Animation Techniques - Index of

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Table <strong>of</strong> Contents<br />

Preface 1<br />

Chapter 1: Introduction 7<br />

<strong>Animation</strong> on the Web 7<br />

The power <strong>of</strong> animated UIs 8<br />

When to use animations 9<br />

When not to use animations 10<br />

<strong>Animation</strong> checklist 10<br />

Animating with <strong>jQuery</strong> 10<br />

The template file 11<br />

Creating a project folder 13<br />

A basic animation example 13<br />

Time for action – creating an animated loader 14<br />

Summary 17<br />

Chapter 2: Fading <strong>Animation</strong>s 19<br />

Fading animations 20<br />

Configuring the animations with arguments 20<br />

<strong>jQuery</strong>'s Unified <strong>Animation</strong> API 21<br />

Enhancing simple CSS hover states with fadeIn 22<br />

Time for action – adding the underlying markup and styling 23<br />

Time for action – scripting the animation 25<br />

Fading elements out 27<br />

Time for action – creating the dialog 29<br />

Fading PNGs in IE 31<br />

Using fadeToggle() for convenient state-checking logic 33<br />

Time for action – showing and hiding with fadeToggle() 34<br />

Greater opacity control with fadeTo() 36<br />

Animating to partial opacity 37<br />

Time for action – creating the example page 38

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!