生活随笔
收集整理的這篇文章主要介紹了
黑客入侵效果网页html,满屏绿字滑下效果
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
黑客入侵效果網頁html代碼
效果如下圖：
想要改變綠色的字就把下面代碼中的編程ID改成你想要的就行，復制代碼粘貼文本文檔，改后綴名為html即可。
<!DOCTYPE html
>
<html lang
="en">
<head
><meta charset
="UTF-8"><meta name
="viewport" content
="width=device-width, initial-scale=1.0"><meta http
-equiv
="X-UA-Compatible" content
="ie=edge"><title
>Document
</title
><style
>*{box
-sizing
: border
-box
;}body
{background
: #
000;margin
: 0;padding
: 0;overflow
: hidden
;text
-shadow
: 0px
0px
80px
;}h1
{margin
: 0;padding
: 0;color
: #
0ff;}a
{color
: #fff
;}p
{margin
: 0;}.box
{width
: 700px
;text
-align
: center
;color
: #fff
;position
: absolute
;margin
: 20px
auto 0;top
: 20px
;left
: 0;right
: 0;}img
{width
: 700px
;height
: 390px
;border
: 2px solid #
222;border
-radius
: 5px
;transition
: 0.8s
;}.img2
:hover
{border
: 2px solid #
980b18
}.box
>div
{padding
: 20px
;}.szj
{position
: absolute
;top
: 0;left
: 0;color
: #fff
;padding
: 5px
;border
: 1px solid #eee
;background
-color
: rgb(0,0,0,0.7)}.yl
{display
: inline;border
-bottom
:1px dotted #
0ff;}.yl a
{text
-decoration
: none
;color
:#c6d491
;}.yl span
{margin
-right
: 8px
;}</style
>
</head
>
<body
><canvas id
="canvas"></canvas
><h1
></h1
><br
><!-- 音樂部分
--><embed height
="0" width
="0" src
="https://m.ximalaya.com/sound/477877435"></embed
><!-- 以下js
--><script
>var canvas
= document
.getElementById('canvas');var ctx
= canvas
.getContext('2d');canvas
.height
= window
.innerHeight
;canvas
.width
= window
.innerWidth
;var texts
= '編程ID'.split('');var fontSize
= 16;var columns
= canvas
.width
/fontSize
;var drops
= [];for(var x
= 0; x
< columns
; x
++){drops
[x
] = 1;}function
draw(){ctx
.fillStyle
= 'rgba(0, 0, 0, 0.05)';ctx
.fillRect(0, 0, canvas
.width
, canvas
.height
);ctx
.fillStyle
= '#0F0';ctx
.font
= fontSize
+ 'px arial';for(var i
= 0; i
< drops
.length
; i
++){var text
= texts
[Math
.floor(Math
.random()*texts
.length
)];ctx
.fillText(text
, i
*fontSize
, drops
[i
]*fontSize
);if(drops
[i
]*fontSize
> canvas
.height
|| Math
.random() > 0.95){drops
[i
] = 0;}drops
[i
]++;}}setInterval(draw
, 33);
</script
>
</body
>
</html
>
喜歡的點個贊再走唄！
總結
以上是生活随笔為你收集整理的黑客入侵效果网页html,满屏绿字滑下效果的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
