javascript实现下雨效果


Posted in Javascript onMarch 27, 2017

效果图:

javascript实现下雨效果

代码如下:

<!doctype html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>梦柯教育-锤子老师</title>
 <style type="text/css">
 *{margin:0;padding:0;list-style-type:none;}
 a,img{border:0;color:#fff;}
 body {
 overflow: hidden;
 background: black;
  text-align: center;
  line-height: 20px;
 }
 </style>
 </head>
 <body><a href="https://jq.qq.com/?_wv=1027&k=469M8qI" rel="external nofollow" id="show" style="position:absolute;bottom:0;left:10px;"></a>
 <canvas id="canvas-club" width="1920" height="666"></canvas>
 <script type="text/javascript">
 eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('d c=1h.1d("1b-19");d 7=c.14("W");d w=c.I=f.z;d h=c.H=f.G;d E=\'18(0, 0, 0, .15)\';d A=Z;d k=[];e g(a,b){16 1a.g()*(b-a)+a}e O(){}O.X={v:e(){6.x=g(0,w);6.y=0;6.B=\'U(C, m%, D%)\';6.w=2;6.h=1;6.F=g(4,5);6.t=3;6.s=1;6.q=2;6.n=g(h*.8,h*.9);6.a=1;6.J=.V},K:e(){l(6.y>6.n){7.T();7.Y(6.x,6.y-6.h/2);7.L(6.x+6.w/2,6.y-6.h/2,6.x+6.w/2,6.y+6.h/2,6.x,6.y+6.h/2);7.L(6.x-6.w/2,6.y+6.h/2,6.x-6.w/2,6.y-6.h/2,6.x,6.y-6.h/2);7.10=\'11(C, m%, D%, \'+6.a+\')\';7.12();7.13()}u{7.M=6.B;7.N(6.x,6.y,6.q,6.q*5)}6.P()},P:e(){l(6.y<6.n){6.y+=6.F}u{l(6.a>.17){6.w+=6.t;6.h+=6.s;l(6.w>m){6.a*=6.J;6.t*=.Q;6.s*=.Q}}u{6.v()}}}};e p(){w=c.I=f.z;h=c.H=f.G}e R(){S(d i=0;i<A;i++){(e(j){1c(e(){d o=1e O();o.v();k.1f(o)},j*1g)}(i))}}e r(){7.M=E;7.N(0,0,w,h);S(d i 1i k){k[i].K()}1j(r)}f.1k("p",p);R();r();',62,83,'||||||this|ctx||||||var|function|window|random||||drops|if|100|hit||resize|size|anim|vh|vw|else|init||||innerWidth|max|color|180|50|clearColor|vy|innerHeight|height|width|va|draw|bezierCurveTo|fillStyle|fillRect||update|98|setup|for|beginPath|hsl|96|2d|prototype|moveTo|30|strokeStyle|hsla|stroke|closePath|getContext|08|return|03|rgba|club|Math|canvas|setTimeout|getElementById|new|push|200|document|in|requestAnimationFrame|addEventListener'.split('|'),0,{}))
 var str = "点击我们学习更多内容";
 setTimeout(function(){
 document.getElementById("show").innerHTML=str;
 },3000)
 </script>
 </body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
在多个页面使用同一个HTML片段的代码
Mar 04 Javascript
js实现幻灯片效果(基于jquery插件)
Nov 05 Javascript
AngularJs页面筛选标签小功能
Aug 01 Javascript
Jquery表单验证失败后不提交的解决方法
Oct 18 Javascript
Javascript+CSS3实现进度条效果
Oct 28 Javascript
解决vue-cli项目打包出现空白页和路径错误的问题
Sep 04 Javascript
Vue循环组件加validate多表单验证的实例
Sep 18 Javascript
JavaScript中的&quot;=、==、===&quot;区别讲解
Jan 22 Javascript
Node.js + express基本用法教程
Mar 14 Javascript
Vue + Elementui实现多标签页共存的方法
Jun 12 Javascript
Vue中使用wangeditor富文本编辑的问题
Feb 07 Vue.js
测量JavaScript函数的性能各种方式对比
Apr 27 Javascript
HTML的select控件美化
Mar 27 #Javascript
JS实现的点击表头排序功能示例
Mar 27 #Javascript
深入理解AngularJS中的ng-bind-html指令
Mar 27 #Javascript
vue2.0实战之基础入门(1)
Mar 27 #Javascript
jQuery中的deferred使用方法
Mar 27 #jQuery
Angular2利用组件与指令实现图片轮播组件
Mar 27 #Javascript
Vue 过渡实现轮播图效果
Mar 27 #Javascript
You might like
php绘制圆形的方法
2015/01/24 PHP
js异步加载的三种解决方案
2013/03/04 Javascript
Javascript中call和apply函数的比较和使用实例
2015/02/03 Javascript
Ajax清除浏览器js、css、图片缓存的方法
2015/08/06 Javascript
关于JavaScript作用域你想知道的一切
2016/02/04 Javascript
JQuery EasyUI学习教程之datagrid 添加、修改、删除操作
2016/07/09 Javascript
JQuery对ASP.NET MVC数据进行更新删除
2016/07/13 Javascript
浅述Javascript的外部对象
2016/12/07 Javascript
通过jquery获取上传文件名称、类型和大小的实现代码
2018/04/19 jQuery
js 图片转base64的方式(两种)
2018/04/24 Javascript
vue 2.8.2版本配置刚进入时候的默认页面方法
2018/09/21 Javascript
浅析Vue.js 中的条件渲染指令
2018/11/19 Javascript
node爬取新型冠状病毒的疫情实时动态
2020/02/06 Javascript
浅谈JavaScript窗体Window.ShowModalDialog使用
2020/07/22 Javascript
python中dir函数用法分析
2015/04/17 Python
python实现mysql的读写分离及负载均衡
2018/02/04 Python
Flask框架Flask-Principal基本用法实例分析
2018/07/23 Python
python爬虫实现中英翻译词典
2019/06/25 Python
python调用并链接MATLAB脚本详解
2019/07/05 Python
Pytorch Tensor 输出为txt和mat格式方式
2020/01/03 Python
django ajax发送post请求的两种方法
2020/01/05 Python
Java byte数组操纵方式代码实例解析
2020/07/22 Python
快速解释如何使用pandas的inplace参数的使用
2020/07/23 Python
Python3爬虫关于识别检验滑动验证码的实例
2020/07/30 Python
Html5之自定义属性(data-,dataset)
2019/11/19 HTML / CSS
中东地区为妈妈们提供一切的头号购物目的地:Sprii
2018/05/06 全球购物
俄罗斯游戏商店:Buka
2020/03/01 全球购物
C,C++的几个面试题小集
2013/07/13 面试题
求职自荐书范文
2013/12/04 职场文书
校园活动策划方案
2014/06/13 职场文书
2014领导班子四风问题查摆思想汇报
2014/09/13 职场文书
八月迷情观后感
2015/06/11 职场文书
HTML5中 rem适配方案与 viewport 适配问题详解
2021/04/27 HTML / CSS
AJAX实现指定部分页面刷新效果
2021/10/16 Javascript
PHP RabbitMQ消息列队
2022/05/11 PHP
阿里云服务器(windows)手动部署FTP站点详细教程
2022/08/05 Servers