想在这个页面上插入一个或一个区域实现文字的逐字显示且能实现分行、缩进。
这是云盘连接网页效果代码都已打包 师哥师姐们打开看一下就行！！谢谢
http://pan.baidu.com/s/19reu9
------解决方案--------------------
弄个浮动层浮动在canvas上就行了吧
<html><head><style>html, body {
height: 100%;
padding: 0;
margin: 0;
background: #000;
}
canvas {
position: absolute;
width: 100%;
height: 100%;
}
#word{position:absolute;color:White;top:25%;left:40%;width:20%;height:50%;z-index:10000}
</style></head><body>
<div id="word"></div>
<canvas id="pinkboard" width="581" height="316"></canvas>
<script type="text/javascript">
function type(txt) {
var text = "123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890";
var textLen = text.length;
var lineNum = 30; //定义每行显示多少个字
var num = 0;
var _ = document.createTextNode('_');
var i = 0;
var me = this;
this.show = function () {
str = text.substr(i, 1);
var txt = document.getElementById('word');
txt.appendChild(document.createTextNode(str));
txt.appendChild(_);
num++;
if (num > 0 && num % lineNum == 0) txt.appendChild(document.createElement('br'));
i++;
if (i < textLen) setTimeout(function () { me.show() }, 300); else txt.removeChild(_);
}
this.show();
}
new type(document.getElementById('word'));
var settings = {
particles: {
length: 500, // maximum amount of particles
duration: 2, // particle duration in sec
velocity: 100, // particle velocity in pixels/sec
effect: -0.75, // play with this for a nice effect
size: 30//, // particle size in pixels
}//,
};
/*
* RequestAnimationFrame polyfill by Erik M?ller
*/
(function(){var b=0;var c=["ms","moz","webkit","o"];for(var a=0;a<c.length&&!window.requestAnimationFrame;++a){window.requestAnimationFrame=window[c[a]+"RequestAnimationFrame"];window.cancelAnimationFrame=window[c[a]+"CancelAnimationFrame"]
------解决方案--------------------
window[c[a]+"CancelRequestAnimationFrame"]}if(!window.requestAnimationFrame){window.requestAnimationFrame=function(h,e){var d=new Date().getTime();var f=Math.max(0,16-(d-b));var g=window.setTimeout(function(){h(d+f)},f);b=d+f;return g}}if(!window.cancelAnimationFrame){window.cancelAnimationFrame=function(d){clearTimeout(d)}}}());
/*
* Point class
*/
var Point = (function() {
function Point(x, y) {
this.x = (typeof x !== 'undefined') ? x : 0;
this.y = (typeof y !== 'undefined') ? y : 0;
}
Point.prototype.clone = function() {
return new Point(this.x, this.y);
};
Point.prototype.length = function(length) {
if (typeof length == 'undefined')
return Math.sqrt(this.x * this.x + this.y * this.y);
this.normalize();