從關閉頁面加載正文內容 - >從頁面加載的左側到右側

我試圖創建一個類似於複印機出來的紙張的頁面效果。我希望裝載完成時的正文內容從左到右出現。我已經看到很多關於如何使用像圖像這樣的induivale元素而不是整個頁面的例子。這是一個拼湊在一起的代碼示例。我似乎無法得到從左到右的效果，我正在尋找和這不適用於IE瀏覽器。我剛開始編寫網頁，所以任何幫助將不勝感激。從關閉頁面加載正文內容 - >從頁面加載的左側到右側

<html> 
<head> 
    <style> 

    body { padding-left: 5000px; -webkit-transition: all 1s ease; transition: all .5s ease; } 

    .loaded { padding-left: 5px; } 

    </style> 

    <script>function loaded (el) { el.classList.add('loaded') }</script> 

</head> 
<body onload="loaded(document.body)"> 
<br><br><br><br><br> 

<table class="tftable" border="0" width="400"> 
    <tr><th></th></tr> 
    <tr><td><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod 
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo 
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse 
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non 
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p></td></tr> 
</table> 

</body> 
</html>

來源

2013-12-16 man0man

嘗試使用jQuery.animate而不是CSS動畫 –

從關閉頁面加載正文內容 - >從頁面加載的左側到右側

回答

相關問題