图片滚动代码全集
, t! w6 m3 h( E一、向左滚动
_8 y; k/ g8 v/ ]' b% `/ H- T5 K& h4 C W( P9 ?
1、调用“图片”栏目图片的向左滚动代码 （效果演示）
% w. \3 @; X; I$ X/ m4 a------------------------------------
! z& y0 o8 u2 K<!--滚动代码开始-->
1 c: F' y- O, t$ X2 G# d( u& H
<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
6 V9 a, B k V* @; Z4 E! @<table cellPadding=0 align=left border=0 cellspace="0">
9 Y; V! d3 ^8 ~; t g2 b, K <tr>
2 X M) @1 _, `, S <td id=demo11 vAlign=top>
+ P* n7 g' O+ C: r% u <!--{$GetPicPhoto(3,0,True,0,12,False,False,0,1,1,130,90,20,0,True,12)}--></td>
, e$ \* f( L) B8 n <td id=demo12 vAlign=top></td>
" u7 i; W" F- b3 V, D </tr>
$ ]* g: f6 Q/ ~2 u0 [ S
</table>
Z' B; _' w6 J7 D+ @2 D
</div>
! s. z) i, W8 v5 H" a4 r9 Z# X p
<SCRIPT>
5 S7 Q8 Y8 p3 _* f
var speed=15
* [: \! n6 E% W) tdemo12.innerHTML=demo11.innerHTML
0 @0 N0 i: U6 e6 j
function Marquee11(){
1 z5 G) P5 ]9 R3 U
if(demo12.offsetWidth-demo.scrollLeft<=0)
# Y+ O8 _- h( i0 ~: ]% Q6 V! ?
demo.scrollLeft-=demo11.offsetWidth
+ Z; o) q3 h1 k; E0 x5 }else{
6 r' C& S" Q, c8 a* o& A
demo.scrollLeft++
1 F- H; L& h6 j; t! L2 Z
}
# D1 x6 P1 Z- v2 r$ k5 ?% ~
}
& p$ z+ m5 ^8 k) o$ T6 t
var MyMar1=setInterval(Marquee11,speed)
' ]( }6 O: e% Q1 T3 g- R8 zdemo.onmouseover=function() {clearInterval(MyMar1)}
9 L9 w9 x8 V5 _; l6 t. s- C& ^3 R3 J
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
, j/ _2 ?/ T% F: n4 [</SCRIPT>
6 q8 ^) D/ F ]- z( U<!--滚动代码结束-->
" |4 h& ~- g7 ], j3 U5 T$ ~
-----------------------------------
6 y" T2 u6 X- w$ e
9 _$ t) s) D6 Z% R# Z- M
2、文章频道图片向左滚动代码 （效果演示）
. |3 [1 D9 \0 |% f. L5 \- m' `
以下是文章频道模板最新图片部分代码
8 W5 U! |* k: m r4 R
-----------------------------------
4 k; D r1 c( ?5 G5 a8 Z<tr>
% b, z" A) l3 \& _' P7 ^4 j<td Class="main_title_575"><b>最新图片{$ChannelShortName}</b></td>
3 k6 N2 [/ h! C5 c" N5 v; s5 D</tr>
: z; T8 {2 [' p! A# i! r6 g% q6 y
<tr>
9 o" ~4 J, ^/ w( y1 v: \& T <td Class="main_tdbg_575"> {$GetPicArticle(ChannelID,0,True,0,4,false,false,0,3,2,130,90,20,0,True,4)} </td>
# O8 t- f3 F& _9 ~% b+ u, V
</tr>
1 K4 Q9 i D, D* }) ?. b @
<tr>
+ ~& S/ o' ]3 X. A3 V% N3 K0 j
<td Class="main_shadow"></td>
; L3 [2 P( ~6 ?
</tr>
, M1 t. E" {+ U0 ?5 R9 H
------------------------------------
) b- Y; T) t( }" L" C) A4 N& U
用以下是滚动代码代替上面红色的标签，注意红色部分的变化。红色数字代表了滚动图片的总数（这里为8张）。
9 U. r/ {1 ]0 C5 s5 {# j----------------------------------
- K) u! ?% z- J9 v<!--滚动代码开始-->
/ E4 _. a% n) a" Z7 t* m<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
! y0 W. u. M& p+ O4 i
<table cellPadding=0 align=left border=0 cellspace="0">
7 m: G0 Y* p! g' p; s9 N5 j) b <tr>
+ C3 f. w9 C8 |1 m0 J! q <td id=demo11 vAlign=top>
) t* O& G# N$ h6 V <!--{$GetPicArticle(ChannelID,0,True,0,8,false,false,0,3,2,130,90,20,0,True,8)}--></td>
. ?1 }) V& T' ~3 h5 @2 P( C# o <td id=demo12 vAlign=top></td>
$ \) U8 _& X" r( o& t% Y3 K </tr>
3 D, J0 S3 J6 B& t7 p0 E ]</table>
* X- t5 y8 S* V, ]4 N! h
</div>
- Z- [8 {& H! R7 }<SCRIPT>
$ B' o7 p4 T2 y* g! \6 [$ u
var speed=15
* X4 V! i9 f6 D, V7 E% M8 p
demo12.innerHTML=demo11.innerHTML
7 J" C$ p4 g$ I
function Marquee11(){
, E: V$ T; s' i2 }" }: S0 ]if(demo12.offsetWidth-demo.scrollLeft<=0)
2 W" _( i4 y2 V" R
demo.scrollLeft-=demo11.offsetWidth
3 { L. A4 i* ?4 p' e P
else{
3 q. D* o Y% E; V) I9 j/ B: v
demo.scrollLeft++
9 `0 t7 ~% E# @: L0 y/ ?0 D
}
) y& Y( H! o5 I% t
}
$ {; Q8 p C4 ^ y7 L8 @var MyMar1=setInterval(Marquee11,speed)
0 k* m3 y7 {( r, t5 g6 W; E
demo.onmouseover=function() {clearInterval(MyMar1)}
& K$ m+ W$ w9 X3 M9 `/ Odemo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
- u2 }' ~; o' N9 A</SCRIPT>
6 l$ b9 `. I+ I<!--滚动代码结束-->
: l( Y& h; g2 J8 V9 Q+ ?1 _' ]
-----------------------------------
) m% X7 f8 {9 W! c
f% b Y* e) ]6 l& ~
3、下载频道图片向左滚动代码 （效果演示）
+ S2 F. `8 Y# v: Y0 G, z9 h以下是下载频道模板推荐下载图片部分代码
4 o! G( Q3 x& `
-----------------------------------
, S& U9 c; ^/ y: u
<tr>
$ b* B, t( `# H4 m* X6 I
<td Class="main_title_575"><table width="100%" border="0" cellspacing="0" cellpadding="0">
* S1 l+ o% ^* R
<tr>
3 V, @2 X: L4 Q8 q' [ Z) W4 U- q
<td><b><a class='Class' href="{$InstallDir}{$ChannelDir}/ShowElite.asp">推荐下载(图)</a></b></td>
. e8 O/ d! L% _" q$ C( m <td align="right">{$RssElite}</td>
( F7 K' t& u- b; m& Y7 y6 u
</tr>
( }+ P. F0 x& j2 H
</table></td>
5 p& k- E0 X ]1 v r# s: _% [: m$ {
</tr>
9 b; V- b. W/ a3 a
<tr>
* Y4 e6 h- V. C1 [ D; c( Q<td align="center" Class="main_tdbg_575"> {$GetPicSoft(ChannelID,0,True,0,4,false,True,0,3,2,130,90,20,0,True,4)} </td>
4 q( m }$ ^8 j! k. ~, P
</tr>
. G; f2 N+ C' d------------------------------------
, V4 E3 g- ?7 i% \! Q" I9 u
用以下是滚动代码代替上面红色的标签，注意红色部分的变化。红色数字代表了滚动图片的总数（这里为12张）。
( P. J( |7 z Q, Q( Z* J------------------------------------
2 c# r' u/ w- Y5 g8 f<!--滚动代码开始-->
9 q' y) P& y- V; m# }, Y% R+ E# h7 X
<div id=demo style="OVERFLOW: hidden; WIDTH: 560px; HEIGHT: 120px">
& I4 y* e' r9 A/ v! l( E9 H9 y
<table cellPadding=0 align=left border=0 cellspace="0">
1 ]$ h. M+ V* l8 z* k& o. F: ~ <tr>
' v& n; u: }2 F$ H) z <td id=demo11 vAlign=top>
3 ?' n& s. [( Q
<!--{$GetPicSoft(ChannelID,0,True,0,12,false,True,0,3,2,130,90,20,0,True,12)}--></td>
' [- I1 n7 T0 A# }; E7 ~1 F% Z$ Q- M <td id=demo12 vAlign=top></td>
0 E/ N1 x1 G) {. B/ ]5 L) ^ </tr>
* n$ t* a$ m/ O</table>
; y5 p1 G, ~1 J& R x' F</div>
" r* i Y+ Q! ], H5 J<SCRIPT>
2 N" g/ h# u( ?; ^1 f
var speed=15
8 j; \7 m5 E8 t
demo12.innerHTML=demo11.innerHTML
# D0 O4 }3 _, U. m
function Marquee11(){
5 n1 u* Y7 A( p5 A0 Gif(demo12.offsetWidth-demo.scrollLeft<=0)
- f2 U' I! b) c& N& pdemo.scrollLeft-=demo11.offsetWidth
) D3 X, c5 O: I! x: helse{
0 Q; L" K+ g& p* z3 X* Hdemo.scrollLeft++
: x5 u- D* g2 v" l5 p}
y6 \4 z4 q' O% n4 y0 S$ A
}
5 P9 b2 d3 t4 s& E5 p$ Avar MyMar1=setInterval(Marquee11,speed)
( Q" T: Z7 ^3 u/ B, h M9 w, Edemo.onmouseover=function() {clearInterval(MyMar1)}
- M% d% G* S* l$ X5 [3 p
demo.onmouseout=function() {MyMar1=setInterval(Marquee11,speed)}
! e0 V+ X5 c2 y; I: `+ ^
</SCRIPT>
# T7 o a/ ^+ A7 F7 d<!--滚动代码结束-->
( p1 }0 Q, m4 q0 f* d! S/ r" v------------------------------
! p9 \. R& L, q$ h
从以上可以看出，滚动图片代码基本上是相同的，不同的是调用图片的标签变了。
$ Z* J$ e$ f$ C, a2 t+ R) m% w' E+ K
------------------------------
6 n8 y* a6 n/ Q) @2 O7 ]/ H8 G8 d! g5 l! ]+ s( i+ `
二、向上滚动
6 R7 b! {5 e, M/ j. g
7 `; O' X! a/ d向上滚动代码使用方法同上左滚动代码，这里只给出代码，不再说明。
! Z9 b: T1 W4 T Q( u以下是文章频道图片调用的滚动代码。
- x. V$ m$ `9 c0 F0 s6 c-----------------------------------------------------------
! V, s: ~6 t8 ^6 m0 d<!--向上滚动代码开始-->
5 |: v2 _: y* y# ^* K5 c# E<DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 160px; HEIGHT: 360px">
0 v% l: p/ v" t8 Z1 |; p
<DIV id=rolllink1>
; Y% \! G4 W4 A <TABLE cellSpacing=5 width="100%">
* `3 w& S& M, E& E
<tr>
6 x0 J$ u! x6 Q# g! H9 h) F% m$ {. X
<td id=demo11 vAlign=top>
- Q. c; N; X) q C% P
<!--{$GetPicArticle(0,0,True,0,6,false,false,0,3,2,160,100,20,0,True,1)}--> </td>
5 X! _/ P, B* K& i) d1 F" g7 `* ~
<td id=demo12 vAlign=top></td>
8 X: T( v1 }- B# g3 V7 s, j" O" f </tr>
% @( r: p% ]9 [9 [' _5 l0 Q4 S </TABLE>
1 j3 t7 L$ r' G</DIV>
0 Z8 T# |/ X+ D, c& s& |' R<DIV id=rolllink2></DIV>
J- a; t' ]1 f& w' ]) k</DIV>
7 @$ {. A, P* O1 a
<SCRIPT>
2 m- }+ W9 v" l( h' I/ xvar rollspeed=40
% V. K } \0 l; C3 _+ `) m- j# @6 B$ Krolllink2.innerHTML=rolllink1.innerHTML
g; l B' F; _
function Marquee(){
' R8 B, z) f- G' E* [9 ~if(rolllink2.offsetTop-rolllink.scrollTop<=0)
% [2 Z. B+ w3 o1 }# j" W( g3 h
rolllink.scrollTop-=rolllink1.offsetHeight
- D% i6 V# I* K0 K3 Relse{
# {! ^, Q( Z! Z$ `rolllink.scrollTop++
5 F% v, L$ q7 J" n9 k+ ?# _- N
}
, T9 X7 H4 R+ x5 T. } D5 }
}
) g; G3 \* c* Z
var MyMar=setInterval(Marquee,rollspeed)
0 L: M6 B7 P- ]8 w% K, A, S' r
rolllink.onmouseover=function() {clearInterval(MyMar)}
6 _; N1 m. J9 o- |$ prolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
4 C6 t: ?* f6 T8 ]" d
</SCRIPT>
3 d0 y5 V8 N; d4 V! l7 T
<!--向上滚动代码结束-->
5 U: @5 s4 L' @4 ^6 G; Y
-----------------------------------------------------------
8 I0 ]/ _/ y6 p4 C7 c+ V以下是图片频道的3行4列向上滚动代码摘录： （效果演示）
/ h( G z( j$ `" P9 c) ]1 G/ z1 e" N
………………………
) [8 L% ~; n5 j' w9 {<tr>
' {/ r9 N" Z, N- J4 p* f; H
<td colspan="3" Class="main_title_575"><a class="Class" href="{$InstallDir}{$ChannelDir}/ShowNew.asp"><b>最新{$ChannelShortName}</b></a></td>
% D4 g7 i8 t& `5 e </tr>
& x0 s$ z3 S5 s# C" A
<tr valign="top">
6 E7 G6 h8 O( z. b8 Z
<td colspan="3"><table width="100%" border="0" cellspacing="0" cellpadding="0" Class="main_tdbg_575">
1 K5 B" Q1 G7 V+ d5 d<tr>
/ l1 v8 X& f" O <td height="200" valign="top">
3 R4 f( A4 d9 |9 G# g3 W/ J
<!--向上滚动代码开始-->
8 p/ z; k# I/ _
<DIV id=rolllink style="OVERFLOW: hidden; WIDTH: 575px; HEIGHT: 365px">
, q6 D9 K2 R* A: x$ D f
<DIV id=rolllink1>
7 g) Q$ M# i% n G% V <TABLE cellSpacing=5 width="100%">
( W' g# y$ j% a0 ~* } <tr>
: j2 d- B7 C0 j; b* K7 r <td id=demo11 vAlign=top>
/ ]2 S) d# R) [% \7 z. Q! h6 q <!--{$GetPicPhoto(ChannelID,0,True,0,24,False,False,0,1,1,130,90,20,0,True, 4)}--></td>
9 l8 G" J! l3 w( g S0 R4 p" o( B6 ^7 X
<td id=demo12 vAlign=top></td>
3 _, y" H) ]( i1 x7 N </tr>
6 C. ~3 _) g* C V. C& R# M </TABLE>
( A' I0 F( Q* ]) s</DIV>
% p! B2 C' L5 U* m( V# x
<DIV id=rolllink2></DIV>
8 H8 Q& ] T j& i: h</DIV>
; m9 U( Q1 r. g3 m& \
<SCRIPT>
* P9 [+ G3 E$ O! p3 d6 L3 T' dvar rollspeed=40
" ^ o$ r6 {* i$ ]
rolllink2.innerHTML=rolllink1.innerHTML
9 a$ I" E- b+ I2 P# A1 g! Afunction Marquee(){
O v. c3 u- K6 }
if(rolllink2.offsetTop-rolllink.scrollTop<=0)
" ]5 |, o# [: B8 M$ P1 G! Z( mrolllink.scrollTop-=rolllink1.offsetHeight
# [, j* P, v/ Relse{
4 s! {; D/ e: J5 Z: r
rolllink.scrollTop++
. z+ o( ^: I! r1 M$ s0 c# A' ?" V& I
}
' X- h: r" ~$ u1 ?7 ^}
% I' m4 `8 A) n/ l. v* \
var MyMar=setInterval(Marquee,rollspeed)
! @; A* h, Q+ `3 X R F
rolllink.onmouseover=function() {clearInterval(MyMar)}
+ a) u4 V6 m* _4 {( |) n6 irolllink.onmouseout=function() {MyMar=setInterval(Marquee,rollspeed)}
0 _: ?5 U) g! E: [</SCRIPT>
) L* I; |. `( a# j. ~4 v; {! {/ f
<!--向上滚动代码结束-->
& h' m% ^' H$ I( c; H( U4 R% n</td>
" h3 U. x5 N; e7 N% ~- ^% e</tr>
+ [) C5 F1 N c% J- }* G" s4 X8 H</table>
( Q( s9 Z- n- _- I9 N
</td>
! f! Z" r! ?) s3 q! m
</tr>
. j4 f- F8 U- Y% A
<tr>
4 q; Q, F9 {. p) ?, H
<td colspan="3" Class="main_shadow"></td>
$ h7 ?+ d5 ~) z
</tr>
* \' ^4 ^9 g$ p0 l
…………………………
0 d ^1 g- ~. @' O/ J; a7 r
0 _: B+ t; S, P- Z) b! ]) X( F' `三、向右滚动
6 T" d4 h5 E% A0 R4 e$ U5 T--------------------------------------
/ q8 E0 M2 b2 u# }: T' @<!--向右滚动代码开始-->
) y- E" L0 S& G<div id=demo style=overflow:hidden;height:120;width:560;>
0 \$ G; r1 [0 D% E<table align=left cellpadding=0 cellspace=0 border=0>
% m7 [5 P ]' Q8 K2 v6 c<tr>
- \% i) i% ]3 J7 Z% G <td id=demo1 valign=top><!--{$GetPicPhoto(3,0,True,0,12,False,False,0,1,1,130,90,20,0,True,12)}--></td>
9 G G/ i5 ]0 r' Q <td id=demo2 valign=top></td>
2 E) U) T. R u) ~
</tr>
6 g9 ]2 m1 K7 V* j( d* P</table>
X! a5 O8 f% B! |5 [& T
</div>
( S, I. c7 l: b b2 z6 h& u
<script>
" l ]3 \, `# [& R& A( ~0 Q var speed=30
7 u; [3 p" s0 N
demo2.innerHTML=demo1.innerHTML
/ g4 e! P9 e C, I
demo.scrollLeft=demo.scrollWidth
3 a. p Y6 L8 R$ P
function Marquee(){
6 a7 y2 ?1 a, E) A if(demo.scrollLeft<=0)
1 p0 j0 E1 i9 g1 f. ? demo.scrollLeft+=demo2.offsetWidth
; u. e* w( @) o) k3 x! P4 I else{
& y! Q6 j$ z$ Q1 `
demo.scrollLeft--
3 R& d i1 ]( C9 P+ L( k }
3 H: ^$ a3 `; e0 L }
$ o- r. y Z5 @( B: `" k
var MyMar=setInterval(Marquee, speed)
, b' x s$ r; Y, m. s
demo.onmouseover=function() {clearInterval(MyMar)}
& O* \8 ]9 z5 L ^
demo.onmouseout=function() {MyMar=setInterval(Marquee, speed)}
6 H3 |/ ?' O9 ]7 y</script>
+ S4 j6 b, L+ Y# v
<!--向右滚动代码结束-->
* d V* S l1 X把其中的<!--{$GetPicPhoto(3,0,True,0,12,False,False,0,1,1,130,90,20,0,True,12)}-->替换成图片地址，多图片用表格做界定。
