O'Reilly logo

Web Design Blueprints by Benjamin LaGrone

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Spreading the clouds

We are not done using that function just yet; we need it once more for the clouds. You will create a loop against an array of the elements with class name clouds and, for each one, get the elements by the tag name I.

The second variable, the vertical height variable, should be equal to 75% of the innerHeight property of the window, and the third variable should be equal to 75% of the innerWidth property. The vertical addition variable is 1, and the horizontal addition variable is half of the window's innerWidth property. Set the position variable to relative and the extension to px. The code is as follows:

for (var I = 0; I < document.getElementsByClassName("clouds").length; i++) { spreadObjects(document.getElementsByClassName("clouds")[i].getElementsByTagName("i"), ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required