Learning CSS3 animations and transitions (1)

Want to learn CSS3 animation, but the domestic this aspect of the book is really few, the example animation examples are often not very good, so malicious under the heart of the internet bought a book abroad, "Learning CSS3 animations and Transitions", in the next time, I want to write a blog way to record reading notes and translation of this book, my English is not good, translation inappropriate places, but also hope you crossing forgive me.

Today is the first day to translate the introduction of each chapter.

　　Chapter One using CSS3 animations

The first chapter of this book is about browser support, including an introduction to the Modernizer JavaScript library, a way for you to detect the user's browser's support for the HTML5 feature, and a few tools and resources and how to use it to make development easier.

　　Chapter II lays the foundation for transforms

Most of the content of this book uses the power of CSS3 transforms. To give you a better understanding of what it can achieve, the second chapter introduces a variety of 2D transformations implemented using CSS3. In this section, you will be taken to draw a bike using only CSS and transforms.

　　Chapter III Animated elements of transitions

The third chapter discusses how to combine transforms and transitions to make the animation move over a period of time. This chapter also discusses how to make other CSS properties move through transitions. In this chapter you will add a wheel rotation animation for the bicycle example in chapter Two and move it under the user's request response.

　　Fourth Chapter keyframe and animations

Keyframe and animations will give you finer control over each transition stage in the animation and contrast it with the transitions. In the fourth chapter you will learn to add a simple animation to a property using Keyframe and animations. You can also animate spring bounce and balloon floats using keyframe and animations.

The fifth chapter realizes 3D effect by parallax scrolling

The fifth chapter combines the concepts of keyframe,animations and transforms parallax scrolling so that the content you build can render 3D without any 3D processing. In this chapter, we will show two sample cases, all of which use parallax scrolling to create a three-dimensional sense in 2D space.

　　Sixth. Add depth by 3D conversion

The sixth chapter describes how to change the depth of an element by using the 3D conversion feature. This chapter explores the various conversion functions that can be applied to the transforms property, and also explores how to use the Perspective property effectively and view the converted results.

　　The seventh chapter 3D conversion animation

The seventh chapter demonstrates how to achieve interesting results by combining 2D and 3D transformations with CSS3 's transitions,keyframe and animations. In this chapter, by using transitions, some HTML5 range input type tags and a small amount of JavaScript make the 3D cube you create in chapter sixth rotate around three axes.

　　The eighth chapter uses transitions and tranforms to move the text.

In the eighth chapter you will combine keyframe,animations,transitions,transforms and a small amount of jquery to create a text-driven animation. Use CSS3 to add some basic styling to the label to make it look like part of the typewriter, and then you'll animate the text typed by Virginia Woolf.

　　Nineth. Create Flash-style animations with keyframe and animations

　　In the Nineth chapter, we will combine the knowledge discussed in the previous chapters to create a kitten with an animated style. The animations show two different styles in different scenes and triggered by the JavaScript timer.

　　Tenth. Creating animated Infographics

　　The tenth chapter covers the basics of infographics and teaches you how to add animations to it. In conjunction with the previous knowledge in the book, the tenth chapter outlines how to create a simple visual data for each of the 6 mixed drinks of different ingredient ratios.

　　11th. Creating Interactive infographics

add interactivity to infographics through a language such as JavaScript or a class library like jquery. in the 11th chapter, you'll make some additions to the infographic in chapter tenth, using CSS animations and jquery to enrich the beverage formulation table.

Finally translated each chapter of the introduction, or the sentence, translation is not good place, but also hope forgive me.