格式化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; 
}