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>
是不是非常酷的效果呢？希望大家能够喜欢。
热门推荐
7 简短的二胎祝福语
10 简短霸气女儿生日 祝福语
11 祝福语高考小众诗句简短
12 元旦祝福语20秒简短
13 老师过年祝福语大全 简短
14 一生祝福语简短
15 产检祝福语简短霸气
16 朋友店开张祝福语简短
17 生日爱情祝福语大全简短
18 朋友女儿生日祝福语 简短