本文实例讲述了爪哇岛描述语言实现很浪漫的气泡冒出特效代码。分享给大家供大家参考。具体如下：运行效果截图如下：

具体代码如下：

实现思路：HTML里只需要一个帆布元素，Javascript里操作canvas1、给帆布里绘制背景图片2、在绘制半径为0-10px的圆形，x坐标屏幕水平随机，y所标竖直大于屏幕高度。圆形背景色可以是随机，那就是各种色彩了！利用计时器控制y -

构建超文本标记语言

！doctype html html lang=' en ' head meta charset=' UTF-8 ' meta name=' Generator ' content=' EditPlus ' meta name=' Author ' content=' meta name=' Keywords ' content=' meta name=' Description ' content=' title 5多个小球往上运动/title style/style/head body div id=' D1 ' canvas id=' canvas '/canvas/div/body/html js代码

脚本var canvas=文档。getelementbyid(' canvas ')；var上下文=canvas。get context(' 2d ')；帆布。宽度=窗口。内部宽度；帆布。高度=窗户。内部高度；函数圈(){这个。x=数学。random()*画布。宽度；这个。y=画布。身高；这个。r=数学。random()* 10；//绘制圆形这个。paint=function(){ context。begin path()；context.arc(this.x，this.y，this.r，0，Math .PI * 2)；context . FillStyle=' white context . GlobalAlpha=0.5 context。fill()；} //控制圆形移动这个。step=function(){ this。y-；} } var circles=[]；函数createCircles(){ var Circle=new Circle()；//?圆[圆圈。长度]=圆；}函数绘制圆圈(){ for(var I=0；长度；I){ 0圆圈[i].paint()；} }函数stepcirces(){ for(var I=0；长度；I){ 0圆圈[i].step()；} } var myimg=new Image()；myimg。src=' http : images/demo-1。png '；var timer=setInterval(function(){ context。绘制图像(myimg，0，0)；计时器；if(timer==0){ createCircles()；}画圆圈()；step circles()；},10);/script需要在自己的网站中添加浪漫元素，这不失为一种好的方式，希望大家灵活运用爪哇岛描述语言实现气泡冒出特效，谢谢大家的阅读。