javascript制作网页图片上实现下雨效果
这里主要是应用了一个rainyday的js类库，使用非常简单方便，就不多废话了，看演示代码吧。
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
<stylemedia="screen">
body{
overflow:hidden;
height:100%;
margin:0;
padding:0;
}
img{
width:100%;
height:100%;
}
</style>
<scriptsrc="http://maroslaw.github.io/rainyday.js/dist/rainyday.0.1.2.min.js"type="text/javascript"></script>
<scripttype="text/javascript">
functionrun(){
varimage=document.getElementById('background');
image.onload=function(){
varengine=newRainyDay({
image:this,
});
engine.rain([[1,2,8000]]);
engine.rain([[3,3,0.88],[5,5,0.9],[6,2,1]],100);
}
image.crossOrigin='anonymous';
image.src='http://i.imgur.com/N7ETzFO.jpg';
}
</script>
<title>哇塞！</title>
</head>
<bodyonLoad="run();">
<imgid="background"alt="background"src=""/>
</body>
</html>
是不是非常酷的效果呢？希望大家能够喜欢。
热门推荐
10 八一幼儿祝福语大全简短
11 公司乔迁食堂祝福语简短
12 婚礼结束聚餐祝福语简短
13 儿媳买车妈妈祝福语简短
14 毕业送礼老师祝福语简短
15 同事辞职正常祝福语简短
16 恭贺新婚文案祝福语简短
17 金店立秋祝福语简短英文
18 婆婆高寿祝福语大全简短