11,黑客帝国中的文字下落效果
感觉很专业哦
代码:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
</HEAD>
<style type="text/css">
body
{
overflow:hidden;
margin:0;
background-color:#000000;
font-family:宋体;
}
DIV.#heike
{
overflow:hidden;
position:relative;
top:5%;
width:90%;
height:90%;
border-style:solid;
border-width:1;
border-color:#009900;
}
</style>
<script language="javascript">
var strCount;
var str;
var Color;
var Font;
var sLine = "W<br>W<br>W<br>.<br>B<br>a<br>i<br>D<br>u<br>.<br>C<br>O<br>M";
function OnLoad()
{
strCount = 40;
str = [];
Color = [];
Font = [];
Color[0] = "#002211";//文字的颜色
Color[1] = "#003311";
Color[2] = "#005511";
Color[3] = "#008811";
Color[4] = "#00BB99";
Color[5] = "#114411";
Color[6] = "#335566";
Color[7] = "#668899";
Color[8] = "#99BBAA";
Color[9] = "#CECECC";
Font[0] = "10px"; //文字的大小
Font[1] = "12px";
Font[2] = "14px";
Font[3] = "16px";
Font[4] = "18px";
setTimeout("strik()",50);
}
function strik()
{
for(var i=0;i<strCount;i++)
{
if(typeof(str[i]) != "undefined") //如果字符串存在
{
if(str[i]["Carch"].style.pixelTop > heike.clientHeight)
{
str[i]["Carch"].outerHTML = "";
delete str[i]["Level"];//删除数组元素
delete str[i]["Speed"];
delete str[i]["Carch"];
delete str[i];
}
else
{
str[i]["Carch"].style.pixelTop += str[i]["Speed"];
}
}
else if(Math.random()<0.25) //随机小数
{
str[i] = new Array();
str[i]["Level"] = Math.round(Math.random()*4);
str[i]["Speed"] = (Math.round(Math.random()*str[i]["Level"])<<2)+10;
document.all["heike"].insertAdjacentHTML("AfterBegin","<span id='SPAN_"+i+"'>"+sLine+"</span>");
str[i]["Carch"] = document.all["SPAN_"+i];
str[i]["Carch"].style.fontSize = Font[str[i]["Level"]]; //字体
str[i]["Carch"].style.position = "absolute"; //位置
str[i]["Carch"].style.pixelLeft = Math.round(Math.random()*heike.clientWidth); //x坐标
str[i]["Carch"].style.pixelTop = -str[i]["Carch"].offsetHeight; //y坐标
str[i]["Carch"].style.color = Color[str[i]["Level"]+5]; //颜色
str[i]["Carch"].style.filter = "glow(Color="+Color[str[i]["Level"]]+",Strength=5)";//滤镜效果
str[i]["Carch"].style.zIndex = str[i]["Level"]; //z-Index
}
}
setTimeout("strik()",50);
}
</script>
<BODY onload="OnLoad()">
<table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="center" height="100%"><div id="heike"></div></td></tr>
<tr><td align="center" style="padding:5;font-size:9pt;color:#FFFFFF;">使用 IE 6.0 以上版本或以 IE 为核心的浏览器浏览本页,1024*768分辨率为佳</td></tr>
</table>
</BODY>
</HTML>
12,动态立体旋转文字效果
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>标题页</title>
<SCRIPT language=javascript>
myWord="欢迎来看北京奥运会" //要旋转的文字
tmpStr="" //连接字符串
Taille=40;
wordLength=myWord.length; //获取文本的长度
for (x=0;x<wordLength;x++)
{
//动态添加层,设置层的ID,和每个层上显示的文本
tmpStr=tmpStr + '<DIV Id=L' + x + ' STYLE="width:3;font-family: Courier New;font-weight:bold;position:absolute;top:40;left:50;z-index:0">' + myWord.charAt(x) + '</DIV>'
}
document.write (tmpStr); //输出动态div层,显示旋转文本
Time=window.setInterval("txtRound()",10); //使用定时器,实现文本的不断旋转
Alpha=5;
I_Alpha=0.05;
function txtRound()
{
Alpha=Alpha-I_Alpha; //类似步长的功能
for (x=0;x<wordLength;x++){
Alpha1=Alpha+0.5*x;
Cosine=Math.cos(Alpha1);
Ob=document.all("L"+x); //获取指定的层
Ob.style.posLeft=100+100*Math.sin(Alpha1)+50; //设置div的x坐标
Ob.style.zIndex=20*Cosine; //设置层的层叠顺序
Ob.style.fontSize=Taille+25*Cosine; //设置层的字体
Ob.style.color="rgb("+ (27+Cosine*80+50) + ","+ (127+Cosine*80+50) + ",0)"; //实现颜色的变化
}
}
</SCRIPT>
</head>
<body>
</body>
</html>
- 大小: 59 KB
- 大小: 8.7 KB
分享到:
相关推荐
javascript实现的黑客帝国中的字符下落特效,很炫
javascript 黑客帝国 超酷 文字下落 javascript 黑客帝国 超酷 文字下落 javascript 黑客帝国 超酷 文字下落 javascript 黑客帝国 超酷 文字下落 javascript 黑客帝国 超酷 文字下落 javascript 黑客帝国 超酷 文字...
黑客帝国中0,1下落的效果实现 javascript
在C++中实现“黑客帝国”式的超酷文字下落特效,主要涉及以下几个知识点: 1. **字符数组与字符串**:首先,我们需要一个包含大量字符的数组或字符串来模拟下落的文字。在C++中,可以使用`char`类型的数组或`std::...
JS+CSS+HTML实现“代码雨”...本文主要介绍了使用JS+CSS+HTML实现“代码雨”类似黑客帝国文字下落效果的技术,涵盖了HTML结构、JavaScript动画实现、CSS样式设计、矩阵代码实现和代码雨效果实现等多个方面的知识点。
在JavaScript(JS)中实现黑客帝国文字下落效果是一种经典的网页动态效果,它模拟了电影《黑客帝国》开头的字符瀑布场景。这个效果通常通过创建多个动态文本元素并以随机速度下落来实现。让我们详细了解一下如何使用...
《黑客帝国》中的字符雨屏幕动画是电影中极具标志性的视觉元素之一,它以其独特的艺术风格和科技感深受人们喜爱。在本项目中,我们将学习如何使用C++编程语言来实现这一经典效果。C++是一种强大的、通用的编程语言,...
通过javascript以及html5实现黑客帝国电影中的文字矩阵特效。
标题中的“安卓动画效果相关-android上仿黑客帝国字符雨.rar”指的是一个Android应用程序,它实现了类似于电影《黑客帝国》中的经典字符雨效果。在《黑客帝国》中,屏幕上的字符快速下落,营造出一种高科技的视觉...
js黑客帝国代码雨特效,炫酷动态效果,前端小白必看! js黑客帝国代码雨特效,炫酷动态效果,前端小白必看! js黑客帝国代码雨特效,炫酷动态效果,前端小白必看! js黑客帝国代码雨特效,炫酷动态效果,前端小白必...
在Android平台上实现“黑客帝国”风格的字符雨效果,是一种极具视觉冲击力的动画设计,它通常涉及到TextView组件、自定义动画以及定时器等技术。接下来,我们将详细探讨如何利用这些技术来创建这样的效果。 首先,`...
在编程世界中,黑客帝国的字符雨特效是一个非常经典的视觉效果,它源自于电影《黑客帝国》中著名的“子弹时间”场景。这个特效通过快速下落的字符流,营造出一种高科技、未来感的氛围。在本项目中,我们将探讨如何...
黑客帝国html前端炫酷效果黑客帝国
此外,JavaScript库如jQuery或Three.js也可以用来创建更复杂的3D效果和动画,进一步模仿电影中的视觉特效。 此外,考虑到"黑客帝国"的标签,我们还可以推测这个项目可能涉及到矩阵代码的设计。在电影中,这些代码以...
在这个“HTML5 Canvas黑客帝国文字瀑布流效果”中,我们将深入探讨如何利用Canvas API实现类似电影《黑客帝国》中经典的绿色字符瀑布效果。 首先,我们需要了解Canvas的基本用法。HTML5的`<canvas>`元素提供了一个...
最后,为了让效果更加逼真,我们还可以添加一些额外的细节,例如随机的字符间距、速度差异,甚至让某些字符在下落过程中旋转,模拟屏幕上的错位感。 总的来说,实现“黑客帝国”代码雨效果是一个结合了HTML5 Canvas...
"js-文字雨-黑客帝国效果"是一个使用JavaScript实现的特效,模仿了电影《黑客帝国》中经典的“绿色代码雨”场景。这个效果通过动态地在页面上显示滚动的文字,营造出一种科技感强烈的视觉体验。 要创建这种文字雨...
JavaScript是一种广泛使用的脚本语言,主要应用于Web开发,它可以实现网页的动态交互效果。JavaScript的核心特性包括变量、数据类型、函数、对象和原型等。通过学习和掌握JavaScript,开发者可以创建复杂的网页应用...
在本主题中,我们将深入探讨如何使用 HTML 和 JavaScript 来实现一个“黑客帝国”式的字母掉落效果,这是一种非常经典的视觉特效,能为网页增添科技感和动感。 首先,HTML(HyperText Markup Language)是网页的...