html代码雨特效代码,html开发数字雨特效代码 - 贪吃蛇学院-专业IT技术平台

数字雨

*{margin: 0 auto;

padding: 0 auto}

body{

background-color: black;

color: limegreen;

position: absolute;

}

var stopmap={};

$(function(){

var num= cnum();

showtop(num);

setInterval(function(){

var num= cnum();

showtop(num);

},8000);

});

function showtop(num){

for(var i=0;i

xunh(num[i]);

}

function xunh(aa){

var dwidht= $(innerWidth);

var y=0;

var data=new Date().getTime();

var time=Math.round(Math.random()*1000);

var lable_Id=time+data;

var x=Math.floor(Math.random()*(dwidht[0]-100));

var lable=""+aa+"";

$(document.body).append(lable);

var stopInterval= setInterval(function(){ movy(lable_Id) },Math.round(Math.random()*1000));

stopmap[lable_Id]=stopInterval;

}

function movy(lableId){

var hwidht= $(innerHeight);

var top=$('#'+lableId).css("top");

if(top==undefined){

return;

}

top=top.substr(0,top.length-2);

top=Number(top)+Math.round(Math.random()*5);

// console.log(top);

if(top>(hwidht[0]-100)){

$('#'+lableId).remove();

console.log(stopmap[lableId]);

clearInterval(stopmap[lableId]);

return;

}

$('#'+lableId).css("top",top+"px");

}

//随机的数字

function cnum(){

var num=[];

// var chars = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F','G',

'H','I','J','K','L','M','N','O','P','Q','R','S','T','U','V','W','X','Y','Z'];

var chars = ['☂','✲','♫','♪','❤','☃'];

for(var i=0;i<100;i++){

// num.push(chars[Math.floor(Math.random()*35)]);

num.push(chars[Math.floor(Math.random()*6)]);

// console.log(num[i]);

}

return num;

}

效果展示

html代码雨特效代码,html开发数字雨特效代码 - 贪吃蛇学院-专业IT技术平台相关推荐

java贪吃蛇代码idea_IntelliJ idea使用笔记 - 贪吃蛇学院-专业IT技术平台
从eclipse切换到Idea有一周时间了,真真实实感受到了idea的强大,我曾经想从eclipse切换到idea,因为使用习惯的问题放弃了,这次狠下心使用了一周,慢慢熟悉了这个强大的开发工具.在此记 ...
php 随机数抽奖代码,php 抽奖概率随机数 Web程序 - 贪吃蛇学院-专业IT技术平台...
$prize_arr = array( '0' => array('id' => 1, 'title' => 'iphone5s', 'v' => 5), '1' => ...
java贪吃蛇客户端服务器_java Socket套接字TCP编程开发服务端和客户端之间的通信 - 贪吃蛇学院-专业IT技术平台...
超级简单,没有太多实质内容的Socket服务端,客户端小程序先运行server 再运行client OK 服务端代码如下: public class Server { public static v ...
easyui java代码生成器,easyui+jdbc+xml模板开发自动化生成报表的java工具 - 贪吃蛇学院-专业IT技术平台...
ps:看到有同学问了一下问题,做一下答复,该实现不是web项目,大家只需要将代码集成到web项目中即可,原项目太大,不便上传.还有 jar包自己找啊呵呵采用easyui+jdbc+xml模板生成报 ...
怎么精炼java代码_网页播放器开发（四）代码精炼提纯(示例代码)
四.精简提炼我们的播放器基本实现了,但是代码复用不高,所以我们要进行封装,以插件的形式体现. 1.插件的基本运行代码如下: ;(function(undefined){'use strict'; . ...
手机数字雨_cmd命令如何实现数字雨的效果
cmd命令是一款可以实现各种操作的电脑命令,很多的小伙伴们最近都在问cmd命令如何实现数字雨的效果?今天小编就为大家带来了cmd命令数字雨教程,感兴趣的话就一起来看看吧. cmd命令数字雨教程: 1. ...
python贪吃蛇代码课程设计_ｃ语言课程设计之贪吃蛇代码及思路　ｃ语言课程设计报告之贪吃蛇...
原文作者:aircraft 原文地址:https://www.cnblogs.com/DOMLX/p/8846529.html 注:本文档需与c语言课程设计之贪吃蛇文档配套使用.c语言实现贪吃蛇代码可 ...
cocos creator开发微信小游戏(五)贪吃蛇大作战
目录小游戏介绍小游戏cocos creator场景图小游戏部分JS代码开发中碰到的问题工程及说明小游戏介绍贪吃蛇小游戏:贪吃蛇试玩(首次加载比较慢),类似贪吃蛇大作战的小游戏.当玩家的蛇 ...
JavaScript+ Canvas开发趣味小游戏《贪吃蛇》
一.效果展示二.<贪吃蛇>基本实现思路蛇头部分+蛇身体部分:采用对象形式来存储坐标,并将每个坐标对象放到一个snake数组中,方便使用.设置每个方格宽度30px,高度30px,画布高度 ...
【Android 2d游戏开发（3）】——贪吃蛇(基于surfaceview框架，精讲)
前两个游戏是基于View游戏框架的,View游戏框架只适合做静止的,异步触发的游戏,如果做一直在动的游戏,View的效率就不高了,我们需要一种同步触发的游戏框架,也就是surfaceview游戏框架, ...

html代码雨特效代码,html开发数字雨特效代码 - 贪吃蛇学院-专业IT技术平台

html代码雨特效代码,html开发数字雨特效代码 - 贪吃蛇学院-专业IT技术平台相关推荐

最新文章

热门文章