会员
众包
新闻
博问
闪存
赞助商
HarmonyOS
Chat2DB
所有博客
当前博客
我的博客
我的园子
账号设置
会员中心
简洁模式
...
退出登录
注册
登录
学习日志
博客园
首页
新随笔
联系
管理
图片连续循环滚动代码(向上、下、左、右)
向上:
<
div
id
=demo
style
="overflow:hidden; width:128px; height:300px;"
>
<
div
id
=demo1
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
</
div
>
<
div
id
=demo2
></
div
>
</
div
>
<
script
language
="javascript"
>
var
speed
=
30
demo2.innerHTML
=
demo1.innerHTML
function
Marquee()
{
if
(demo2.offsetTop
-
demo.scrollTop
<=
0
)
demo.scrollTop
-=
demo1.offsetHeight
else
{
demo.scrollTop
++
}
}
var
MyMar
=
setInterval(Marquee,speed)
demo.onmouseover
=
function
()
{clearInterval(MyMar)}
demo.onmouseout
=
function
()
{MyMar
=
setInterval(Marquee,speed)}
</
script
>
向下:
<
div
id
=demo
style
="overflow:hidden; width:128px; height:300px;"
>
<
div
id
=demo1
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
<
img
src
="/529blog/gfjs.gif"
><
br
><
img
src
="/529blog/bxtt.gif"
><
br
><
img
src
="/529blog/bzjd.gif"
><
br
>
</
div
>
<
div
id
=demo2
></
div
>
</
div
>
<
script
language
="javascript"
>
var
speed
=
30
demo2.innerHTML
=
demo1.innerHTML
demo.scrollTop
=
demo.scrollHeight
function
Marquee()
{
if
(demo1.offsetTop
-
demo.scrollTop
>=
0
)
demo.scrollTop
+=
demo2.offsetHeight
else
{
demo.scrollTop
--
}
}
var
MyMar
=
setInterval(Marquee,speed)
demo.onmouseover
=
function
()
{clearInterval(MyMar)}
demo.onmouseout
=
function
()
{MyMar
=
setInterval(Marquee,speed)}
</
script
>
向左:
<
div
id
=demo
style
="overflow:hidden;height:100px;width:300px;"
><
table
align
=left
cellpadding
=0
cellspace
=0
border
=0
><
tr
><
td
id
=demo1
valign
=top
><
img
src
="/529blog/gfjs.gif"
><
img
src
="/529blog/bxtt.gif"
><
img
src
="/529blog/bzjd.gif"
><
img
src
="/529blog/gfjs.gif"
><
img
src
="/529blog/bxtt.gif"
><
img
src
="/529blog/bzjd.gif"
></
td
><
td
id
=demo2
valign
=top
></
td
></
tr
></
table
></
div
>
<
script
>
var
speed
=
30
demo2.innerHTML
=
demo1.innerHTML
function
Marquee()
{
if
(demo2.offsetWidth
-
demo.scrollLeft
<=
0
)
demo.scrollLeft
-=
demo1.offsetWidth
else
{
demo.scrollLeft
++
}
}
var
MyMar
=
setInterval(Marquee,speed)
demo.onmouseover
=
function
()
{clearInterval(MyMar)}
demo.onmouseout
=
function
()
{MyMar
=
setInterval(Marquee,speed)}
</
script
>
向右:
<
div
id
=demo
style
="overflow:hidden;height:100px;width:300px;"
><
table
align
=left
cellpadding
=0
cellspace
=0
border
=0
><
tr
><
td
id
=demo1
valign
=top
><
img
src
="/529blog/gfjs.gif"
><
img
src
="/529blog/bxtt.gif"
><
img
src
="/529blog/bzjd.gif"
><
img
src
="/529blog/gfjs.gif"
><
img
src
="/529blog/bxtt.gif"
><
img
src
="/529blog/bzjd.gif"
></
td
><
td
id
=demo2
valign
=top
></
td
></
tr
></
table
></
div
>
<
script
>
var
speed
=
30
demo2.innerHTML
=
demo1.innerHTML
demo.scrollLeft
=
demo.scrollWidth
function
Marquee()
{
if
(demo.scrollLeft
<=
0
)
demo.scrollLeft
+=
demo2.offsetWidth
else
{
demo.scrollLeft
--
}
}
var
MyMar
=
setInterval(Marquee,speed)
demo.onmouseover
=
function
()
{clearInterval(MyMar)}
demo.onmouseout
=
function
()
{MyMar
=
setInterval(Marquee,speed)}
</
script
>
posted on
2007-08-11 20:17
石川
阅读(
1089
) 评论(
0
)
收藏
举报
刷新页面
返回顶部