分享DZ2.5滚动图片模块代码

首先说明下，我是一个菜鸟，我的模版还是买的，但主页就少个图片展示的框架，开始弄了个静态的，后来在网上找了个能够滚动的，代码放上去，有乱码，可能是以前人家放出来的是针对1.5版本的，我把代码修改了，2.5能用了，现在放出来给各位新手站长们分享下：

1. 
   
2. <P><style type="text/css">
   
3. <!--
   
4. .panpanluoBox{width:960px;overflow:hidden;padding:5px 5 5px 5px;margin:0 auto;}
   
5. .panpanluoBox .LeftBotton{height:114px;width:11px;background:url(static/image/common/panpanluo_button_l.gif) no-repeat 0px </P>
   
6. <P>0;overflow:hidden;float:left;display:inline;margin:0px 0 0 0;cursor:pointer;}
   
7. .panpanluoBox .RightBotton{height:114px;width:11px;background:url(static/image/common/panpanluo_button_r.gif) no-repeat 0px </P>
   
8. <P>0;overflow:hidden;float:left;display:inline;margin:0px 0 0 0;cursor:pointer;}
   
9. .panpanluoBox .Cont{width:936px;overflow:hidden;float:left;}
   
10. .panpanluoBox .ScrCont{width:10000000px;}
    
11. .panpanluoBox .Cont .pic{width:175px;float:left;text-align:center;}
    
12. .panpanluoBox .Cont .pic img{padding:4px;background:#fff;border:1px solid #ccc;display:block;margin:0 auto;}
    
13. .panpanluoBox .Cont .pic p{line-height:26px;color:#505050;}
    
14. .panpanluoBox .Cont a:link,.panpanluoBox .Cont a:visited{color:#626466;text-decoration:none;}
    
15. .panpanluoBox .Cont a:hover{color:#f00;text-decoration:underline;}
    
16. .panpanluoBox #List1,.panpanluoBox #List2{float:left;}
    
17. -->
    
18. </style>
    
19. <div class="module cl ml">
    
20. <div class="panpanluoBox">
    
21. <div class="LeftBotton"></div>
    
22. <div class="Cont" id="ISL_Cont">
    
23. <div class="ScrCont">
    
24. <div id="List1">
    
25. <!-- 图片载入 begin -->
    
26. [loop]
    
27. <div class="pic">
    
28. <a href="{url}"{target}><img src="{pic}" width="{picwidth}" height="{picheight}" alt="{title}" /></a>
    
29. <p><a href="{url}" title="{title}"{target}>{title}</a></p>
    
30. </div>
    
31. [/loop]
    
32. <!-- 图片载入 end -->
    
33. </div>
    
34. <div id="List2"></div>
    
35. </div>
    
36. </div>
    
37. <div class="RightBotton"></div>
    
38. </div>
    
39. </div>
    
40. </div>
    
41. <script language="javascript" type="text/javascript">
    
42. <!--//--><![CDATA[//><!--
    
43. var Speed = 1; //速度(毫秒)
    
44. var Space = 1; //每次移动(px)
    
45. var PageWidth = 935; //移位宽度
    
46. var fill = 0; //整体移动
    
47. var MoveLock = false;
    
48. var MoveTimeObj;
    
49. var Comp = 0;
    
50. var AutoPlayObj = null;
    
51. GetObj("List2").innerHTML = GetObj("List1").innerHTML;
    
52. GetObj('ISL_Cont').scrollLeft = fill;
    
53. GetObj("ISL_Cont").onmouseover = function(){clearInterval(AutoPlayObj);}
    
54. GetObj("ISL_Cont").onmouseout = function(){AutoPlay();}
    
55. AutoPlay();
    
56. function GetObj(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}
    
57. function AutoPlay(){ //自动滚动
    
58. clearInterval(AutoPlayObj);
    
59. AutoPlayObj = setInterval('ISL_GoDown();ISL_StopDown();',5000); //间隔时间
    
60. }
    
61. function ISL_GoUp(){
    
62. if(MoveLock) return;
    
63. clearInterval(AutoPlayObj);
    
64. MoveLock = true;
    
65. MoveTimeObj = setInterval('ISL_ScrUp();',Speed);
    
66. }
    
67. function ISL_StopUp(){
    
68. clearInterval(MoveTimeObj);
    
69. if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0){
    
70. Comp = fill - (GetObj('ISL_Cont').scrollLeft % PageWidth);
    
71. CompScr();
    
72. }else{
    
73. MoveLock = false;
    
74. }
    
75. AutoPlay();
    
76. }
    
77. function ISL_ScrUp(){
    
78. if(GetObj('ISL_Cont').scrollLeft <= 0){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft + GetObj('List1').offsetWidth}
    
79. GetObj('ISL_Cont').scrollLeft -= Space ;
    
80. }
    
81. function ISL_GoDown(){
    
82. clearInterval(MoveTimeObj);
    
83. if(MoveLock) return;
    
84. clearInterval(AutoPlayObj);
    
85. MoveLock = true;
    
86. ISL_ScrDown();
    
87. MoveTimeObj = setInterval('ISL_ScrDown()',Speed);
    
88. }
    
89. function ISL_StopDown(){
    
90. clearInterval(MoveTimeObj);
    
91. if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0 ){
    
92. Comp = PageWidth - GetObj('ISL_Cont').scrollLeft % PageWidth + fill;
    
93. CompScr();
    
94. }else{
    
95. MoveLock = false;
    
96. }
    
97. AutoPlay();
    
98. }
    
99. function ISL_ScrDown(){
    
100. if(GetObj('ISL_Cont').scrollLeft >= GetObj('List1').scrollWidth){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft - GetObj
     
101. ('List1').scrollWidth;}
     
102. GetObj('ISL_Cont').scrollLeft += Space ;
     
103. }
     
104. function CompScr(){
     
105. var num;
     
106. if(Comp == 0){MoveLock = false;return;}
     
107. if(Comp < 0){
     
108. if(Comp < -Space){
     
109. Comp += Space;
     
110. num = Space;
     
111. }else{
     
112. num = -Comp;
     
113. Comp = 0;
     
114. }
     
115. GetObj('ISL_Cont').scrollLeft -= num;
     
116. setTimeout('CompScr()',Speed);
     
117. }else{
     
118. if(Comp > Space){
     
119. Comp -= Space;
     
120. num = Space;
     
121. }else{
     
122. num = Comp;
     
123. Comp = 0;
     
124. }
     
125. GetObj('ISL_Cont').scrollLeft += num;
     
126. setTimeout('CompScr()',Speed);
     
127. }
     
128. }
     
129. //--><!]]>
     
130. </script></P>

复制代码

方法：
在你想要添滚动图片的地方DIY添加好框架，再添加一个贴子模块填好标题，直接以下代码粘贴进去，更新OK，就是这么简单。
把左右键按纽图片上传到static\image\common目录下



演示网站：http://www.25shiyan.com/

谢谢分享

好东西。。不错啊。。。

编辑代码的时候卡死了