This is an example Apple style custom background scroll animation. Using the scrollbar in the container below, the Sunset background begins it’s animation as the content becomes visible. Continuing to scroll animates a 2nd section showing a flower bloom.

Custom Scroll Animation

This example of custom scroll animation was originally set up as full page background. The user scrolls and the background animates while the content becomes visible

No jQuery

The custom animation is created with plain JavaScript and CSS. Template can viewed here.

Providing custom functionality and styling

Using PHP, JavaScript, jQuery, HTML, CSS, MySQL and related frameworks,

Over 10 years experience

Working as a freelance web developer Ernies High is skilled in both frontend and backend coding.

Creating custom functionality and styling using PHP, JavaScript/jQuery, HTML, CSS, MySQL and related frameworks

Credits

The scrolling function is borrowed from A codepen by Jacob. It is modifed to meet my needs and wants.

The images are taken from a video on Adobe Stock. Then saved as JPG’s using Photoshop.

To see a few examples

Check out Ernies High

This was originally designed to be a full page animated background for the homepage. After awhile I decided to add it as a sample post, opting for a simpler CSS animation on the home page. The animation is done with plain JavaScript the raw code is Template can viewed here..

See other examples of animation here