日期:2014-05-16 浏览次数:20548 次
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>Jx About</title>
<meta http-equiv="imagetoolbar" content="no">
<style type="text/css">
html {
overflow: hidden;
width: 100%;
height: 100%;
}
body {
background: -webkit-gradient(linear, 0 0, 0 900, from(#025695), to(#ADD1E3)) repeat scroll 0 0 transparent;
background: -moz-linear-gradient(center top, #025695, #ADD1E3) repeat scroll 0 0 transparent;
background: -o-linear-gradient(top, #025695, #ADD1E3);
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#025695',endColorStr='#ADD1E3',gradientType='0');
width: 100%;
height: 100%;
color: #fff;
margin: 0;
padding: 0;
}
.full {
width: 100%;
height: 100%;
}
#frm {
position: absolute;
width: 100%;
height: 100%;
left: 5%;
top: 60px;
font-size: 2em;
font-weight: bold;
font-family: verdana, arial;
overflow: hidden;
padding: 0.5em;
}
#frm span {
position: relative;
text-align: center;
z-index: 1;
}
#mtxform {
position: relative;
z-index: 10;
}
.hidden {
visibility: hidden;
}
h1 {
font-size: 2.5em;
font-weight: bold;
font-family: verdana, arial;
color: #fff;
border-bottom: 1px solid #eee;
width: 90%;
line-height: 1.8;
margin: 0 auto;
}
</style>
<script type="text/javascript">
var mtx = function () {
/* ==== private variables & methods ==== */
var stop = false;
var frm, lineDelay, charDelay;
var colorText, colorMatch, colorGhost, elapsedTime;
var lineIndex = 0;
var lineChar = [];
var animStack = [];
var colorStack = [];
/* ==== rgb color ==== */
function colorRGB (c) {
return 'rgb('
+Math.round(Math.min(255, Math.max(0, c[0])))+','
+Math.round(Math.min(255, Math.max(0, c[1])))+','
+Math.round(Math.min(255, Math.max(0, c[2])))+')';
}
/* ==== Easing functions ==== */
function Ease () {}
Ease.prototype = {
ease : function () {
this.m += this.s;
this.x0 += (this.d * this.m * .0025);
if (this.m == 20) this.s = -1;
return this.x0;
},
init : function (x0, x1) {
this.m = 0;
this.s = 1;
this.d = x1 - x0;
this.x0 = x0;
}
}
/* ==== Load Lines ==== */
function loadLines () {
// read text from HTML form
text = document.forms.mtxform.text.value.split("\n");
// loop through all lines
for (var j = 0; j < text.length; j++) {
var t = text[j];
if (t) {
var n = t.length;
lineChar[j] = [];
// first pass: create characters capture RELATIVE offset coordinates
for (var i = 0; i < n; i++)
lineChar[j][i] = new Character(t.charAt(i), j);
// second pass: convert to absolute position
for (var i = 0, o; o = lineChar[j][i]; i++) {
if (o.c == "|") {
// remove spaces
lineChar[j].splice(i, 1);
frm.removeChild(o.o);
i--;
} else {