简化了下百度的代码
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>w3cfuns </title> </head> <body> <div id="center"></div> <script> var myCenter = document.getElementById("center"); function createTable(str) { var myTable = document.createElement("table"); var myTr = document.createElement("tr"); var myTd = document.createElement("td"); myCenter.appendChild(myTable); myTable.appendChild(myTr); myTr.appendChild(myTd); myTd.setAttribute("class", "f"); myTd.style.color = "#" + parseInt(Math.random()*0xffffff).toString(16); myTd.style.backgroundColor = "#" + parseInt(Math.random()*0xffffff).toString(16); myTd.innerHTML = str; } for(var i = 0; i < 10; i ++) { createTable("HELLO W3CFUNS<br>HAHAHAHAHAHAHAHAHA<br>WHAT ARE YOU DOING"); } createTable(""); </script> <script src="http://img.baidu.com/img/iknow/static/transformers.js" type="text/javascript"></script> </body> </html> 主要是操纵类为f的td,transformers.js里有动画的坐标来控制移动
预览地址 http://06wjin.sinaapp.com//html5/baidu/