2008/10/01 万家灯火

 2008/10/01 中央10套 "第10放映室"之万家灯火 关于爱情的主题

 

少年: 爱情是一袭白衣

青年: 爱情是一杯啤酒

中年: 爱情是一碗炸酱面

老年: 爱情是一桌麻将

以下是一个简单的万家灯火背景特效的JS代码: ```html <!DOCTYPE html> <html> <head> <title>万家灯火背景特效</title> <style type="text/css"> body { margin: 0; padding: 0; height: 100vh; background-color: #000; overflow: hidden; } canvas { position: absolute; top: 0; left: 0; z-index: -1; } </style> </head> <body> <canvas id="myCanvas"></canvas> <script type="text/javascript"> window.onload = function() { var canvas = document.getElementById('myCanvas'); canvas.width = window.innerWidth; canvas.height = window.innerHeight; var ctx = canvas.getContext('2d'); var particles = []; function Particle() { this.x = canvas.width * Math.random(); this.y = canvas.height * Math.random(); this.vx = (Math.random() - 0.5) * 5; this.vy = (Math.random() - 0.5) * 5; this.radius = 5; } Particle.prototype.draw = function() { ctx.beginPath(); ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2); ctx.fillStyle = 'rgba(255, 255, 255, 0.8)'; ctx.fill(); }; Particle.prototype.update = function() { this.x += this.vx; this.y += this.vy; if (this.x < 0 || this.x > canvas.width) { this.vx *= -1; } if (this.y < 0 || this.y > canvas.height) { this.vy *= -1; } }; for (var i = 0; i < 1000; i++) { particles.push(new Particle()); } function loop() { ctx.clearRect(0, 0, canvas.width, canvas.height); for (var i = 0; i < particles.length; i++) { particles[i].draw(); particles[i].update(); } requestAnimationFrame(loop); } loop(); }; </script> </body> </html> ``` 该代码会在页面背景中生成许多随机移动的白色圆点,效果类似于万家灯火。可以通过调整代码中的参数来改变特效的效果,例如圆点数量、运动速度、颜色透明度等。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值