1 screen saver2 <script type="text/javascript">3 4 function r(m) {5 return (m*Math.random()).toFixed(0);6 };7 8 function c() {9 return r(1)*255; 10 }11 12 var Box = function(dom) {13 this.dom = dom;14 this.dom.setAttribute('data-component', 'box');15 };16 17 Box.prototype.start = function() {18 19 var s = r(20)+0;20 21 this.dom.style.width = s + 'px';22 this.dom.style.height = s + 'px';23 24 this.dom.style.left = r(screen.width - s) + 'px';25 this.dom.style.top = r(screen.height - s) + 'px';26 27 this.dom.style.backgroundColor = 'rgba('+c()+','+c()+','+c()+', '+(r(10)/10)+')';28 29 var that = this;30 var t = r(2000);31 setTimeout(function() {32 that.dom.style.transition = 'all '+(t/1000)+'s ease';33 that.start(); 34 }, t);35 };36 37 var boxes = document.querySelectorAll('[data-component="box"]');38 39 for (var i=0; i<boxes.length; i++) {40 var box = new Box(boxes[i]);41 box.start();42 }43 44 for (var i=0; i<r(100); i++) {45 var div = document.createElement('div');46 document.body.appendChild(div);47 var box = new Box(div);48 box.start();49 }50 51 52 53 </script>Enlace
El enlace para compartir es: