qpython3h数字雨代码,html开发数字雨特效代码

数字雨

*{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;

}

效果展示

qpython3h数字雨代码,html开发数字雨特效代码相关推荐

网页广告代码php,【网页广告特效代码】精选5种常用的网页广告特效代码
网站少不了发布一些活动广告,网页中的广告显示效果有很多种,一般是采用JS或者JQ实现多种网页广告显示效果,以下是php中文网精选5种常用的网页广告特效代码推荐给大家下载使用! 效果预览和下载地址:ht ...
value数字 vue_基于Vue开发数字输入框组件
随着 vue 越来越火热, 相关组件库也非常多啦, 只用轮子怎么够, 还是要造起来!!! 1.概述 vue组件开发的api:props.events和slots 2.组件代码效果: (1)index ...
数字藏品APP系统开发|数字藏品系统引见
数字藏品是应用区块链技术辨认权益归属的数字作品.艺术品和商品.数字藏品能够在区块链网络中标志其具有者并追溯其后续流通,包括但不限于数字图片.音乐.视频.电子门票.数字留念品等方式.简单来说,数字藏品 ...
【无极低码】低代码平台开发日记，低代码平台之sql编程
关于0代码和低代码的开发,作者也写过好多篇文章介绍了,目前功能也还在逐步优化中,并且已经在好几个商业项目中使用过了,今天我们继续讲解低代码或0代码中的sql解析规则零代码.低代码对于软件市场的影响: ...
数字孪生智慧工厂开发数字孪生工厂解决方案
工业化是一个动态的,不断发展的过程,随着区块链技术成熟,第四次工业革命这边即将来临,针对数字孪生智慧工厂技术已经开始逐步实施,可以看到好多企业主这边已经开始针对数字孪生技术做改造,其实数字孪生技术最开 ...
repo同步代码_iTOP-4412开发板android4.0代码下载和编译
Android4.0 源码可以从光盘,网盘获取稳定版本,也可以从 GitHub 下载我们的开发版本.GitHub 仅提供源码下载,不提供二进制下载,二进制文件存放在光盘和网盘中. 基于迅为4412开 ...
几款web开发常用jquery特效代码
特效网: http://www.xwcms.net 1.图片拖动特效 http://www.xwcms.net/js/tpdm/32946.html 2.弹出层焦点图特效: http://www.x ...
数字艺术藏品系统开发
数字藏品商城系统开发,联系看主页或私信,数字藏品商城App开发,数字藏品商城小程序开发,数字藏品软件开发,数字藏品平台开发,数字藏品模式制度开发数字藏品的应用领域非常地广泛,也具有巨大的价值,但目前 ...
低代码分析盘点：银行业低代码应用需要规避两大误区
易观分析:低代码不等于无代码,需要明确低代码与无代码开发平台的差异,同时,低代码不是一个行业概念或者技术概念,低代码不局限于具体的应用场景,而是可以应用在各类系统.应用.组件的开发中.易观分析针对&q ...
淘宝商城商品分类特效代码
这是一个淘宝商城商品分类特效代码,非常漂亮的网页特效代码,好多人会喜欢这个产品分类导航特效我一直认为商城的设计模式是淘宝创造出来的,特别是左侧的菜单,几乎各种商城都一样,一个大的分类,鼠标划过,你可 ...

qpython3h数字雨代码,html开发数字雨特效代码

qpython3h数字雨代码,html开发数字雨特效代码相关推荐

最新文章

热门文章