JavaScript写的随机选人真实案例
随机选人的小网页,先看效果图。
生成动态流星雨的画布放到上生成随机数的操作界面之上的话,会看不到生成随机数的操作界面。
生成动态特效的canvas画布占了操作界面的div的位置,后来我将div放到画布的上面,又将div设置定位让其不占位置,才将布局弄好。
页面的代码。
<span style="color: #008000">
<span style="color: #0000ff"><<span style="color: #800000">link <span style="color: #ff0000">rel<span style="color: #0000ff">="stylesheet"<span style="color: #ff0000">
href<span style="color: #0000ff">="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap-theme.min.css"<span style="color: #ff0000">
integrity<span style="color: #0000ff">="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp"<span style="color: #ff0000">
crossorigin<span style="color: #0000ff">="anonymous"<span style="color: #0000ff">>
<span style="color: #008000">
<span style="color: #0000ff"><<span style="color: #800000">script
<span style="color: #ff0000">src<span style="color: #0000ff">="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"<span style="color: #ff0000">
integrity<span style="color: #0000ff">="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"<span style="color: #ff0000">
crossorigin<span style="color: #0000ff">="anonymous"<span style="color: #0000ff">></<span style="color: #800000">script<span style="color: #0000ff">>
<span style="color: #0000ff"></<span style="color: #800000">head<span style="color: #0000ff">>
<span style="color: #0000ff"><<span style="color: #800000">style<span style="color: #0000ff">><span style="background-color: #f5f5f5; color: #800000">
body <span style="background-color: #f5f5f5; color: #000000">{<span style="background-color: #f5f5f5; color: #ff0000">
overflow<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> hidden<span style="background-color: #f5f5f5; color: #000000">; <span style="background-color: #f5f5f5; color: #008000">/<span style="background-color: #f5f5f5; color: #008000">当内容溢出时,不显示<span style="background-color: #f5f5f5; color: #008000">/
<span style="background-color: #f5f5f5; color: #008000">/<span style="background-color: #f5f5f5; color: #008000"> background-image: url("image/流星雨.jpg"); <span style="background-color: #f5f5f5; color: #008000">/
<span style="background-color: #f5f5f5; color: #000000">}<span style="background-color: #f5f5f5; color: #800000">
.divv <span style="background-color: #f5f5f5; color: #000000">{<span style="background-color: #f5f5f5; color: #ff0000">
position<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> absolute<span style="background-color: #f5f5f5; color: #000000">;<span style="background-color: #f5f5f5; color: #ff0000">
top<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> 50px<span style="background-color: #f5f5f5; color: #000000">;<span style="background-color: #f5f5f5; color: #ff0000">
left<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> 42%<span style="background-color: #f5f5f5; color: #000000">;<span style="background-color: #f5f5f5; color: #ff0000">
width<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> 268px<span style="background-color: #f5f5f5; color: #000000">;<span style="background-color: #f5f5f5; color: #ff0000">
height<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> 600px<span style="background-color: #f5f5f5; color: #000000">;
<span style="background-color: #f5f5f5; color: #000000">}<span style="background-color: #f5f5f5; color: #800000">
num <span style="background-color: #f5f5f5; color: #000000">{<span style="background-color: #f5f5f5; color: #ff0000">
text-align</span><span style="background-color: #f5f5f5; color: #000000">:</span><span style="background-color: #f5f5f5; color: #0000ff"> center</span><span style="background-color: #f5f5f5; color: #000000">;</span><span style="background-color: #f5f5f5; color: #ff0000">
color</span><span style="background-color: #f5f5f5; color: #000000">:</span><span style="background-color: #f5f5f5; color: #0000ff"> white</span><span style="background-color: #f5f5f5; color: #000000">;</span><span style="background-color: #f5f5f5; color: #ff0000">
font-size</span><span style="background-color: #f5f5f5; color: #000000">:</span><span style="background-color: #f5f5f5; color: #0000ff"> 40px</span><span style="background-color: #f5f5f5; color: #000000">;</span>
<span style="background-color: #f5f5f5; color: #000000">}<span style="background-color: #f5f5f5; color: #800000">
.button <span style="background-color: #f5f5f5; color: #000000">{<span style="background-color: #f5f5f5; color: #ff0000">
text-align<span style="background-color: #f5f5f5; color: #000000">:<span style="background-color: #f5f5f5; color: #0000ff"> center<span style="background-color: #f5f5f5; color: #000000">;
<span style="background-color: #f5f5f5; color: #000000">}<span style="background-color: #f5f5f5; color: #800000">
img <span style="background-color: #f5f5f5; color: #000000">{<span style="background-color: #f5f5f5; color: #ff0000">
width</span><span style="background-color: #f5f5f5; color: #000000">:</span><span style="background-color: #f5f5f5; color: #0000ff"> 268px</span><span style="background-color: #f5f5f5; color: #000000">;</span><span style="background-color: #f5f5f5; color: #ff0000">
height</span><span style="background-color: #f5f5f5; color: #000000">:</span><span style="background-color: #f5f5f5; color: #0000ff"> 271px</span><span style="background-color: #f5f5f5; color: #000000">;</span>
<span style="background-color: #f5f5f5; color: #000000">}<span style="background-color: #f5f5f5; color: #800000">
canvas <span style="background-color: #f5f5f5; color: #000000">{
<span style="background-color: #f5f5f5; color: #000000">}
<span style="color: #0000ff"></<span style="color: #800000">style<span style="color: #0000ff">>
<span style="color: #0000ff"><<span style="color: #800000">body<span style="color: #0000ff">>
<span style="color: #0000ff"><</span><span style="color: #800000">div </span><span style="color: #ff0000">class</span><span style="color: #0000ff">="divv"</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"><</span><span style="color: #800000">img </span><span style="color: #ff0000">class</span><span style="color: #0000ff">="img-thumbnail"</span><span style="color: #ff0000"> alt</span><span style="color: #0000ff">="头像"</span><span style="color: #ff0000"> id</span><span style="color: #0000ff">="img"</span><span style="color: #ff0000"> src</span><span style="color: #0000ff">="image/yuan.jpg"</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"><</span><span style="color: #800000">div </span><span style="color: #ff0000">id</span><span style="color: #0000ff">="num"</span><span style="color: #0000ff">></</span><span style="color: #800000">div</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"><</span><span style="color: #800000">div </span><span style="color: #ff0000">class</span><span style="color: #0000ff">="button"</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"><</span><span style="color: #800000">button </span><span style="color: #ff0000">id</span><span style="color: #0000ff">="start"</span><span style="color: #ff0000"> class</span><span style="color: #0000ff">="btn btn-success"</span><span style="color: #0000ff">></span>开始<span style="color: #0000ff"></</span><span style="color: #800000">button</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"><</span><span style="color: #800000">button </span><span style="color: #ff0000">id</span><span style="color: #0000ff">="stop"</span><span style="color: #ff0000"> class</span><span style="color: #0000ff">="btn btn-info"</span><span style="color: #0000ff">></span>结束<span style="color: #0000ff"></</span><span style="color: #800000">button</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"></</span><span style="color: #800000">div</span><span style="color: #0000ff">></span>
<span style="color: #0000ff"></</span><span style="color: #800000">div</span><span style="color: #0000ff">></span>
<span style="color: #008000"><!--</span><span style="color: #008000">
<canvas>画布 画板 画画的本子
</span><span style="color: #008000">--></span>
<span style="color: #0000ff"><</span><span style="color: #800000">canvas </span><span style="color: #ff0000">width</span><span style="color: #0000ff">=400 </span><span style="color: #ff0000">height</span><span style="color: #0000ff">=400 </span><span style="color: #ff0000">style</span><span style="color: #0000ff">="background: #000000;"</span><span style="color: #ff0000"> id</span><span style="color: #0000ff">="canvas"</span><span style="color: #0000ff">></</span><span style="color: #800000">canvas</span><span style="color: #0000ff">></span>
<span style="color: #008000"><!--</span><span style="color: #008000">
javascript 画笔
</span><span style="color: #008000">--></span>
<span style="color: #0000ff"></<span style="color: #800000">body<span style="color: #0000ff">>
<span style="color: #0000ff"><<span style="color: #800000">script <span style="color: #ff0000">type<span style="color: #0000ff">="text/javascript"<span style="color: #0000ff">>
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> num <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> document.getElementById(<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">num<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">);
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> img <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> document.getElementById(<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">img<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">);
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> start <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> document.getElementById(<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">start<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">);
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> stop <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> document.getElementById(<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">stop<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">);
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> image <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> [ <span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">image/XX.jpg<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">image/zXXn.jpg<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">image/XX.jpg<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">image/XX.jpg<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000"> ];
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> arr <span style="background-color: #f5f5f5; color: #000000">=<span style="background-color: #f5f5f5; color: #000000"> [ <span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">曹XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">赵XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">李XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">马XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">,<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000">沈XX<span style="background-color: #f5f5f5; color: #000000">"<span style="background-color: #f5f5f5; color: #000000"> ];
<span style="background-color: #f5f5f5; color: #0000ff">var<span style="background-color: #f5f5f5; color: #000000"> intv <span style="background-color: #f5f5f5; color: #000000">= <span style="background-color: #f5f5f5; color: #0000ff">null<span style="background-color: #f5f5f5; color: #000000">;
start.onclick </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">() {
</span><span style="background-color: #f5f5f5; color: #0000ff">if</span><span style="background-color: #f5f5f5; color: #000000"> (intv </span><span style="background-color: #f5f5f5; color: #000000">==</span><span style="background-color: #f5f5f5; color: #000000"> undefined) {
intv </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> setInterval(</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">() {
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> random </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> Math.floor(Math.random() </span><span style="background-color: #f5f5f5; color: #000000">*</span> <span style="background-color: #f5f5f5; color: #000000">6</span><span style="background-color: #f5f5f5; color: #000000">);
num.innerHTML </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> arr[random];
img.src </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> image[random];
},</span><span style="background-color: #f5f5f5; color: #000000">500</span><span style="background-color: #f5f5f5; color: #000000">);
}
}
stop.onclick </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000">() {
clearInterval(intv);
intv </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #0000ff">null</span><span style="background-color: #f5f5f5; color: #000000">;
}
</span><span style="background-color: #f5f5f5; color: #008000">/*</span><span style="background-color: #f5f5f5; color: #008000"> 下面是流星雨<a href="https://www.jb51.cc/tag/daima/" target="_blank" class="keywords">代码</a> </span><span style="background-color: #f5f5f5; color: #008000">*/</span>
<span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> canvas </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> document.getElementById(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">canvas</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">);
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> ctx </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> canvas.getContext(</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">2d</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">);
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> s </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> window.screen;
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> w </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> s.width;
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> h </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> s.height;
canvas.width </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> w;
canvas.height </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> h;
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> fontSize </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">14</span><span style="background-color: #f5f5f5; color: #000000">;
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> clos </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> Math.floor(w </span><span style="background-color: #f5f5f5; color: #000000">/</span><span style="background-color: #f5f5f5; color: #000000"> fontSize);
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> drops </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> [];
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> str </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">qwertyuiopasdfghjklzxcvbnm</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">;
</span><span style="background-color: #f5f5f5; color: #0000ff">for</span><span style="background-color: #f5f5f5; color: #000000"> (</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> i </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">; i </span><span style="background-color: #f5f5f5; color: #000000"><</span><span style="background-color: #f5f5f5; color: #000000"> clos; i</span><span style="background-color: #f5f5f5; color: #000000">++</span><span style="background-color: #f5f5f5; color: #000000">) {
drops.push(</span><span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">);
}
</span><span style="background-color: #f5f5f5; color: #0000ff">function</span><span style="background-color: #f5f5f5; color: #000000"> drawString() {
ctx.fillStyle </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">rgba(0,0.05)</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">
ctx.fillRect(</span><span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">,</span><span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">,w,h);
ctx.font </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">600 </span><span style="background-color: #f5f5f5; color: #000000">"</span> <span style="background-color: #f5f5f5; color: #000000">+</span><span style="background-color: #f5f5f5; color: #000000"> fontSize </span><span style="background-color: #f5f5f5; color: #000000">+</span> <span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">px 微软雅黑</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">;
ctx.fillStyle </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">#00ff00</span><span style="background-color: #f5f5f5; color: #000000">"</span><span style="background-color: #f5f5f5; color: #000000">;
</span><span style="background-color: #f5f5f5; color: #0000ff">for</span><span style="background-color: #f5f5f5; color: #000000"> (</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> i </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">; i </span><span style="background-color: #f5f5f5; color: #000000"><</span><span style="background-color: #f5f5f5; color: #000000"> clos; i</span><span style="background-color: #f5f5f5; color: #000000">++</span><span style="background-color: #f5f5f5; color: #000000">) {
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> x </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> i </span><span style="background-color: #f5f5f5; color: #000000">*</span><span style="background-color: #f5f5f5; color: #000000"> fontSize;
</span><span style="background-color: #f5f5f5; color: #0000ff">var</span><span style="background-color: #f5f5f5; color: #000000"> y </span><span style="background-color: #f5f5f5; color: #000000">=</span><span style="background-color: #f5f5f5; color: #000000"> drops[i] </span><span style="background-color: #f5f5f5; color: #000000">*</span><span style="background-color: #f5f5f5; color: #000000"> fontSize;
ctx.fillText(str[Math.floor(Math.random() </span><span style="background-color: #f5f5f5; color: #000000">*</span><span style="background-color: #f5f5f5; color: #000000"> str.length)],x,y);
</span><span style="background-color: #f5f5f5; color: #0000ff">if</span><span style="background-color: #f5f5f5; color: #000000"> (y </span><span style="background-color: #f5f5f5; color: #000000">></span><span style="background-color: #f5f5f5; color: #000000"> h </span><span style="background-color: #f5f5f5; color: #000000">&&</span><span style="background-color: #f5f5f5; color: #000000"> Math.random() </span><span style="background-color: #f5f5f5; color: #000000">></span> <span style="background-color: #f5f5f5; color: #000000">0.99</span><span style="background-color: #f5f5f5; color: #000000">) {
drops[i] </span><span style="background-color: #f5f5f5; color: #000000">=</span> <span style="background-color: #f5f5f5; color: #000000">0</span><span style="background-color: #f5f5f5; color: #000000">;
}
drops[i]</span><span style="background-color: #f5f5f5; color: #000000">++</span><span style="background-color: #f5f5f5; color: #000000">;
}
}
setInterval(drawString,</span><span style="background-color: #f5f5f5; color: #000000">30</span><span style="background-color: #f5f5f5; color: #000000">);
<span style="color: #0000ff"></<span style="color: #800000">script<span style="color: #0000ff">>
<span style="color: #0000ff"></<span style="color: #800000">html<span style="color: #0000ff">>
原文链接:https://www.f2er.com/js/238552.html