免費論壇 繁體 | 簡體
Sclub交友聊天~加入聊天室當版主
分享
新浪微博
QQ空间
Facebook
Google+
Plurk
Twitter
Line
Board logo

标题: 分享一个我的图片轮播代码给大家 [打印本页]
作者: mc0713    时间: 2018-8-29 20:11     标题: 分享一个我的图片轮播代码给大家

  1. <style type="text/css">
  2. <!--
  3. #demo {
  4. background: #FFF;
  5. overflow:hidden;
  6. border: 1px dashed #CCC;
  7. width: 958px;
  8. }
  9. #demo img {
  10. border: 3px solid #F2F2F2;
  11. }
  12. #indemo {
  13. float: left;
  14. width: 955%;
  15. }
  16. #demo1 {
  17. float: left;
  18. }
  19. #demo2 {
  20. float: left;
  21. }
  22. -->
  23. </style>
  24. <div id="demo">
  25. <div id="indemo">
  26. <div id="demo1">
  27. <a href='http://mc0713.66rt.com/thread-244-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180818/1808180947d7f7a346491f15af.jpeg width=120 height=80 border="0"/></a>
  28. <a href='http://mc0713.66rt.com/thread-252-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180819/1808192233d7ac3b44cd9ff999.jpeg width=120 height=80 border="0"/></a>
  29. <a href='http://mc0713.66rt.com/thread-234-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180815/1808152130365854e7350e7a02.jpg width=120 height=80 border="0"/></a>
  30. <a href='http://mc0713.66rt.com/thread-246-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180818/1808181323529c8b9ecb65210a.jpg width=120 height=80 border="0"/></a>
  31. <a href='http://mc0713.66rt.com/thread-249-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180818/1808182217ce8d5828b84c18e3.gif width=120 height=80 border="0"/></a>
  32. <a href='http://mc0713.66rt.com/thread-250-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180819/18081907386d2a2d1f57ea0572.jpeg width=120 height=80 border="0"/></a>
  33. <a href='http://mc0713.66rt.com/thread-221-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180813/1808131849e844bc32d7e49f73.jpeg width=120 height=80 border="0"/></a>
  34. <a href='http://mc0713.66rt.com/thread-254-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180820/18082010070a297697fea30560.jpg width=120 height=80 border="0"/></a>
  35. <a href='http://mc0713.66rt.com/thread-39-1-2.html'><img src=http://mc0713.66rt.com/attachments/day_180807/1808071816176aacf6ae3e2a8f.jpeg width=120 height=80 border="0"/></a>
  36. <a href='http://mc0713.66rt.com/thread-222-1-1.html'><img src=http://mc0713.66rt.com/attachments/day_180813/180813185994946ea6bcf50b08.jpeg width=120 height=80 border="0"/></a>
  37. <div id="demo2"></div>
  38. </div>
  39. </div>
  40. <script>
  41. <!--
  42. var speed=10;
  43. var tab=document.getElementById("demo");
  44. var tab1=document.getElementById("demo1");
  45. var tab2=document.getElementById("demo2");
  46. tab2.innerHTML=tab1.innerHTML;
  47. function Marquee(){
  48. if(tab2.offsetWidth-tab.scrollLeft<=0)
  49. tab.scrollLeft-=tab1.offsetWidth
  50. else{
  51. tab.scrollLeft++;
  52. }
  53. }
  54. var MyMar=setInterval(Marquee,speed);
  55. tab.onmouseover=function() {clearInterval(MyMar)};
  56. tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
  57. -->
  58. </script>
复制代码
上面的图片链接图片所在帖子链接自行本地记事本更换，代码可放第三，头部，广告等位置，自己选择合适的地方放吧，我就不一一解释了。



欢迎光临 麻城生活网 (http://www.mc0713.66rt.com/) Powered by Discuz! 7.2