一个html+css+js的轮播图片 -- 仅供参考
16lz
2021-01-22
好久没打网页程序了,标签和css 之类都忘的跟空白一样,花几天时间把丢掉的东西给捡起来。
附上 html+css+js 代码
html:
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>轮播图片</title> 6 <link href="css/css.css" rel="stylesheet" type="text/css" /> 7 <script src="js/js.js" type="text/javascript"></script> 8 </head> 9 10 <body> 11 <div id="container"> 12 <div id="list" style="left: -600px;"> 13 <img src="images/5.jpg" alt="1"/> 14 <img src="images/1.jpg" alt="1"/> 15 <img src="images/2.jpg" alt="2"/> 16 <img src="images/3.jpg" alt="3"/> 17 <img src="images/4.jpg" alt="4"/> 18 <img src="images/5.jpg" alt="5"/> 19 <img src="images/1.jpg" alt="5"/> 20 </div> 21 <div id="buttons"> 22 <span index ="1" class="on"></span> 23 <span index ="2"></span> 24 <span index ="3"></span> 25 <span index ="4"></span> 26 <span index ="5"></span> 27 </div> 28 <a href="javascript:;" id ="prev" class="arrow"><</a> 29 <a href="javascript:;" id ="next" class="arrow">></a> 30 </div> 31 </body> 32 </html>