格式化JS生成的文本？

Question

我发现下面的代码：

var index = 0; 
var text = 'Hardcode'; 
// Here you can put in the text you want to make it type. 
function type() 
{ 
document.getElementById('intro1').innerHTML += text.charAt(index); 
index += 1; 
var t = setTimeout('type()',200); 
// The time taken for each character here is 100ms. You can change it if you want. 
} 

的问题是，文本只适用于很少的一些属性在我的CSS（标有//）：

#intro1 { 
font-family: 'Press Start 2P', cursive; //OK 
font-size: 80px; //OK 
display: block; //? 
text-align: center; //OK 
margin-bottom: auto; 
margin-top: auto; 
top: 50%; 
} 

我试图让文本显示在页面的中心，但JavaScript忽略了我的放置。 当我将文本直接输入到HTML中的div时，它工作正常，但是当我用JavaScript做肮脏的工作时，它就搞砸了。

另外，如何添加一个延迟动画（间隔开始后）？

请帮忙吗？

Answer 1

我改变了你拨打type()函数的方式setInterval。希望这可以回答你的问题。

http://jsfiddle.net/fenderistic/eHGK8/

JS

var index = 0; 
var text = 'Hardcode'; 
// Here you can put in the text you want to make it type. 
var f = setTimeout(function() { 
    type() 
}, 1000); 

function type() { 
    document.getElementById('intro1').innerHTML += text.charAt(index); 
    index += 1; 
    var t = setTimeout(function() { 
     type() 
    }, 200); 
    // The time taken for each character here is 100ms. You can change it if you want. 
} 

CSS

html, body { 
margin: 0; 
padding: 0; 
width: 100%; 
height: 100%; 
display: table 
} 
#intro1 { 
display: table-cell; 
text-align: center; 
vertical-align: middle; 
font-family:'Press Start 2P', cursive; 
font-size: 80px; 
}