HTML實現程式碼雨

阿新 • • 發佈：2021-01-09

網頁版HTML實現程式碼雨，希望大家滿意O(∩_∩)O

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>黑客帝國程式碼雨
</title>
<style type="text/css">
*{margin:0;padding:0;}
body{background:black;}
canvas{display:block;}
</style>
</head>
<body>
< 
canvas id="c"></canvas>
<script type="text/javascript">
var c=document.getElementById("c");
var ctx= c.getContext("2d");
c.height=window.innerHeight;
c.width=window.innerWidth;
var chinese="010110";
chinese=chinese.split("");
var font_size= 
10;
var columns=c.width/font_size;
var drops=[];
for(var i=0;i<columns;i++)
	drops[i]=1;
function draw(){
	ctx.fillStyle="rgba(0,0,0,0.05)";
	ctx.fillRect(0,0,c.width,c.height);
	ctx.fillStyle="#0F0";
	ctx.font=font_size+"px arial";
	for(var i=0;i<drops.length;i++){
	var text= 
chinese[Math.floor
(Math.random()*chinese.length)];
ctx.fillText(text,i*font_size,drops[i]*font_size);
if(drops[i]*font_size>c.height&&Math.random()>0.975)
	drops[i]=0;
	drops[i]++;
	}
}
setInterval(draw,50);
</script>
</body>
</html>

JS+CSS+HTML實現“程式碼雨”類似黑客帝國文字下落效果

先看看JS+CSS+HTML實現“程式碼雨”類似黑客帝國文字下落最終效果： HTML程式碼：

HTML實現程式碼雨

網頁版HTML實現程式碼雨，希望大家滿意O(∩_∩)O <!DOCTYPE html> <html> <head>

HTML+JS實現“程式碼雨”效果原始碼（黑客帝國文字下落效果）

我們先看看HTML+JS實現“程式碼雨”的最終效果 1、綠色： 2、彩色： 3、背景色：

jquery外掛實現程式碼雨特效

本文例項為大家分享了jquwww.cppcns.comery外掛實現程式碼雨特效的具體程式碼，供大家參考，具體內容如下

JavaScript canvas實現程式碼雨效果

本文例項為大家分享了canvas實現程式碼雨效果的具體程式碼，供大家參考，具體內容如下

js+canvas實現程式碼雨效果

本文例項為大家分享了+canvas程式碼雨效果的具體程式碼，供大家參考，具體內容如下

JavaScript實現程式碼雨效果

本文例項為大家分享了實現程式碼雨效果的具體程式碼，供大家參考，具體內容如下

JS實現程式碼雨特效

本文例項為大家分享了實現程式碼雨特效的具體程式碼，供大家參考，具體內容如下

javascript中innerHTML 獲取或替換html內容的實現程式碼

innerHTML 屬性用於獲取或替換 HTML 元素的內容，語法為Object.innerHTML 其中1.Object是獲取的元素物件，如通過document.getElementById(\"ID\")獲取的元素；2.注意書寫，innerHTML區分大小寫。

電影黑客帝國中程式碼雨如何實現？簡單！用 Python 就能實現！

說起電影《黑客帝國》，相信大部分人都看過或聽說過，影片中有一個場景數字雨，如果你看過電影的話，應該對這個經典場景印象深刻，本文我們利用 Python 以數字、字母、圖片三種形式來實現這一效果。

JavaScript Html實現移動端紅包雨功能頁面

本文例項為大家分享了Html實現移動端紅包雨功能頁面的具體程式碼，供大家參考，具體內容如下

Vue實現紅包雨小遊戲的示例程式碼

目錄0 寫在前面1 準備工作2 設計HTML+樣式3 設計邏輯4 完整程式碼0 寫在前面紅包也叫壓歲錢，是過農曆春節時長輩給小孩兒用紅紙包裹的禮金。據傳明清時期，壓歲錢大多數是用紅繩串著賜給孩子。民國以後，則演變為用

SpringBoot靜態視訊實時播放的實現程式碼

問題描述 Spring Boot API 定義 GET 請求 API ，返回視訊流。前端通過 <video> 標籤載入並播放視訊，效果是必須等整個視訊資源全部載入到瀏覽器才能播放，而且 <video> 標籤預設的進度條無法控制視訊的

Android倒計時功能的實現程式碼

好久沒有寫部落格了，趁著年末，總結了下最近一年所遇到的一些技術問題，還有一些自定義控制元件，比如倒計時功能

Java日期時間及日期相互轉換實現程式碼

這篇文章主要介紹了Java日期時間及日期相互轉換實現程式碼,文中通過示例程式碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

JavaWeb分頁的實現程式碼例項

這篇文章主要介紹了JavaWeb分頁的實現程式碼例項,文中通過示例程式碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下

Mybatis如何傳入多個引數的實現程式碼

第一種方式：使用@Param註解方式此種方式用法是我們在介面中寫方法的引數時，在每個引數的前面加上一個@Param註解即可。

android 震動和提示音的實現程式碼

android的訊息提示（震動和提示音），實現程式碼如下所示： public class VibratorUtil {

spring security獲取使用者資訊的實現程式碼

前言我們在使用spring security的時候可以通過好幾種方法獲取使用者資訊,但是今天這篇文章介紹的是一個筆者覺得最優雅的實現; 借鑑現有的spring security controller自動注入引數的方法,我們來進一步的實現更適合我

VBS遍歷Excel工作表的實現程式碼

核心程式碼 \'****************************************** \'拖拽檔案，獲取檔案路徑 \'******************************************