<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>For my Girl</title> <style type="text/css"> #divAdvert { position: absolute; font: 60px Arial; top: 4px; left: 0px; } </style> <script type="text/javascript"> var switch_location = false; var current_color; var current_process = 0; function doAnimation() { var divAdvert = document.getElementById("divAdvert"); var currentLeft = divAdvert.offsetLeft; var currentTop = divAdvert.offsetTop; var windowHeight = window.innerHeight; var windowWidth = window.innerWidth; var newLocationLeft, newLocationHeight; if(switch_location == false) { newLocationLeft = currentLeft + 2; newLocationHeight = currentTop + 2; document.body.style.backgroundColor = "#FFB5B5"; divAdvert.style.color = "#C48888"; divAdvert.innerHTML = "我爱你"; if(currentLeft >= windowWidth || currentTop >= windowHeight) { switch_location = true; } } else { newLocationLeft = currentLeft - 2; newLocationHeight = currentTop - 2; divAdvert.style.color = "#FF359A"; if(current_process == 0) { document.body.style.backgroundColor = "#FFD9EC"; divAdvert.innerHTML = "我爱你"; } else if(current_process == 60) { document.body.style.backgroundColor = "#FFC1E0"; divAdvert.innerHTML = "我爱你,至"; } else if(current_process == 120) { document.body.style.backgroundColor = "#ffaad5"; divAdvert.innerHTML = "我爱你,至死"; } else if(current_process == 180) { document.body.style.backgroundColor = "#FF95CA"; divAdvert.innerHTML = "我爱你,至死不"; } else if(current_process == 240) { document.body.style.backgroundColor = "#FF79BC"; divAdvert.innerHTML = "我爱你,至死不渝"; } if(currentLeft <= divAdvert.style.fontSize || newLocationHeight <= divAdvert.style.fontSize) { switch_location = false; current_process = 0; } if(current_process != 240) { ++current_process; } } divAdvert.style.left = newLocationLeft + "px"; divAdvert.style.top = newLocationHeight + "px"; } </script> </head> <body οnlοad="setInterval(doAnimation, 10)"> <div id="divAdvert">I love U</div> </body> </html>
七夕告白
最新推荐文章于 2024-08-06 09:15:43 发布