javascript投影片實現代碼

提示：您可以先修改部分代碼再運行

<p><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><style type="text/css"> *{ margin: 0; padding: 0; } #test{ position: relative; width: 300px; height: 200px; overflow: hidden; border: 1px solid #d4d4d4; } #test ul{ position: absolute; top:0; left: 0; height:200px; } #test ul li{ float: left; width: 300px; height:200px; } @-webkit-keyframes myAnimation{ 0%{ top:0; } 40%{ top:-200px; } 70%{ top:-400px; } 100%{ top:-600px; } } #test ul{ -webkit-animation-name:myAnimation; -webkit-animation-duration:4s; -webkit-animation-timing-function:linear; -webkit-animation-iteration-count:infinite; } </style></p><div id="test"><ul> <li></li> <li></li> <li></li> <li></li></ul></div></td> </tr></table>

提示：您可以先修改部分代碼再運行