求指教哪里错了,我用的notepad++和谷歌浏览器。。。
<!doctype html> <html> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <title>Document</title> <style> #my3dspace{ perspective:800; perspective-origin:50% 100%; transform-style:preserve-3d; overflow:auto; } #pagegroup{ width:400px; height:400px; margin:0 auto; position:relative; } .page{ width:360px; height:360px; padding:20px; background-color:black; color:white; font-size:360px; font-weight:bold; line-height:360px; text-align:center; position:absolute; } #page1{ transform-origin:bottom; transition:transform 1s linear; } #page2, #page3, #page4, #page5, #page6{ transform-origin:bottom; transition:transform 1s linear; transform:rotateX(90deg); } #op{ text-align:center; margin:40px auto; } </style> <style type="text/javascript"> var curindex=1; function next(){ if(curindex==6) {return;} var curpage=getElementById("page"+curindex); curpage.style.transform="rotateX(-90deg)"; curindex++; var nextpage=getElementById("page"+curindex); nextpage.style.transform="rotateX(0deg)"; } function prev(){ if(curindex==1) { return;} var curpage=getElementById("page"+curindex); curpage.style.transform="rotateX(90deg)"; curindex--; var nextpage=getElementById("page"+curindex); nextpage.style.transform="rotateX(0deg)"; } </style> </head> <body> <div id="my3dspace"> <div id="pagegroup"> <div id="page1">1</div> <div id="page2">2</div> <div id="page3">3</div> <div id="page4">4</div> <div id="page5">5</div> <div id="page6">6</div> </div> </div> <div id="op"> <a href="javascript:next()">next</a> <a href="javascript:prev()">prev</a> </div> </body> </html>
哪里错了嘛!!求指教