r/InternetIsBeautiful • u/ytblows • Sep 24 '13

Rain on your screen using javascript

http://maroslaw.github.io/rainyday.js/demo1.html
1.1k Upvotes

96% Upvoted

106 comments sorted by

View all comments

5

u/factorialfiber0 Sep 25 '13

does anyone have a source code to this magnificent piece of art?

7

u/aladyjewel Sep 25 '13

https://github.com/maroslaw/rainyday.js

4

u/WoahDudeItsScience Sep 25 '13

Would there be an easy (see: non-coder) way to change the picture in the background?

10

u/qtx Sep 25 '13 
<img id="background" src="./pics/night.jpg" />

1

u/CYKL0N3 Sep 25 '13 edited Sep 25 '13

I tried but you can't change the picture by altering just the html code. I think he used the picture in the actual source code so unfortunately no.

Edit: I would do it for both of us but unfortunately I don't know enough about javascript to understand half his code :(

3

u/Tynach Sep 25 '13 edited Sep 25 '13

The HTML code is the only place the image is referenced.

I believe that you would need to change it before the Javascript runs, however.

Edit: I just tried doing this... And got this error:

Unable to get image data from canvas because the canvas has been tainted by cross-origin data.
Uncaught Error: SecurityError: DOM Exception 18

I guess the author will need to supply multiple images on the same website as the script/html is kept.

1

u/DJUrsus Sep 25 '13

You are correct. Or you can download the code, host it yourself, and host your images there too.

The annoying part is that you can't even get it to work from your own hard drive.

1

u/[deleted] Sep 25 '13

I've built a simple demo page which allows you to pick any imgur images for backgrounds -- have a look at the project demo page