A web page concept using time of day to change images.
Using simple Javascript to set time and delays.
Note: Video below is time lapsed and has added smooth transitions.
Usage:
Unzip the folder and run the index.html in your browser.
Customise:
Show images as background, foreground, or both.
See comments in shadows.js for instructions.
Change the image set to your own if required.
Change the image src in the shadows.js file.
Instead of waiting an hour or more, you can test your images by uncommenting the var time = new Date().getSeconds(); line in the shadows.js file.
Don't forget to comment out the other line.
Change the setTimeout(start, 5000); to 500 if using seconds.
Change the index.html and style.css to suit your needs.
That's about it.
Notes:
If you are running this on an online server the image sizes would need to be reduced, or better still create your own svg images.
TODO list:
- Smooth transitions
- Overlay filter ???
Disclaimer:
Unless stated otherwise, images, screenshots, and videos are conceptual only and do not form part of this license.
LICENSE: MIT License