Login | Register   
LinkedIn
Google+
Twitter
RSS Feed
Download our iPhone app
TODAY'S HEADLINES  |   ARTICLE ARCHIVE  |   FORUMS  |   TIP BANK
Browse DevX
Sign up for e-mail newsletters from DevX


advertisement
 

Tip: Parallax Scrolling Effect in HTML

Learn how to move the background image at a different speed from the images in the foreground.


advertisement

This web design technique moves the background image at a different speed from the images in the foreground.

Sample Code: Parallax Scrolling

.parallax {
   background-image: url (???example.jpg???);
   height: 100%;
   background-size: cover;
   background-position: center;
   background-attachment: fixed;
   background-repeat: no-repeat;

 

Visit the DevX Tip Bank

 





   
Octavia Andreea Anghel is a senior PHP developer currently working as a primary trainer for programming teams that participate at national and international software-development contests. She consults on developing educational projects at a national level. She is a coauthor of the book "XML Technologies--XML in Java" (Albastra, ISBN 978-973-650-210-1), for which she wrote the XML portions. In addition to PHP and XML, she's interested in software architecture, web services, UML, and high-performance unit tests.
Comment and Contribute

 

 

 

 

 


(Maximum characters: 1200). You have 1200 characters left.

 

 

Sitemap
Thanks for your registration, follow us on our social networks to keep up-to-date