Book Image

Web Design Blueprints

Book Image

Web Design Blueprints

Overview of this book

The book delivers simple instructions on how to design and build modern Web using the latest trends in web development. You will learn how to design responsive websites, created with modern Flat User Interface design patterns, build deep-scrolling websites with parallax 3D effects, and roll-your-own single-page applications. Finally, you'll work through an awesome chapter that combines them all. Each chapter features actual lines of code that you can apply right away.
Table of Contents (12 chapters)
Web Design Blueprints
Credits
About the Author
About the Reviewer
www.PacktPub.com
Preface
Index

Setting the left positions


This function will be used to animate the cloud's movement across the viewport by getting the element's left position and adding to it incrementally on each scroll. It receives in the function call the variable's element and increment. In the function, you will first work with the element's style left property using the split method on the string p.

We need to add some failsafe fallback here in case the value is not a number. This could happen if there isn't any value for the style's left property. To verify whether this value is a number, first use the parseInt function on the value you just created and check that it's not NaN (Not a Number). If this logical step passes, return the value of the bounding rectangle's left property of the element, with the string px appended to it.

If the logical test fails, using else, get the integer value of the element's style left property by using the parseInt function and then the absolute value of it, and then add the increment...