图片连续循环滚动代码(向上、下、左、右)
2015-07-15 14:10
489 查看
向上:
<div id=demo style="overflow:hidden; width:128px; height:300px;">
<div id=demo1>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><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="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><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="2.jpg"><img
src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img
src="2.jpg"></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="2.jpg"><img
src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img
src="2.jpg"></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>
收藏于 2009-08-04
来自于百度空间
<div id=demo style="overflow:hidden; width:128px; height:300px;">
<div id=demo1>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><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="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><br>
<img src="2.jpg"><br><img src="2.jpg"><br><img src="2.jpg"><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="2.jpg"><img
src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img
src="2.jpg"></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="2.jpg"><img
src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img src="2.jpg"><img
src="2.jpg"></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>
收藏于 2009-08-04
来自于百度空间
相关文章推荐
- Python学习笔记——ADO访问数据库
- c/c++名称修饰
- php -- 魔术方法 之 对象克隆 : __clone()
- Python 之 数据类型、类与对象
- 新浪微博错误提示代码
- HDU-1092-A+B for Input-Output Practice (IV)(继续!)
- 【JAVA多线程】JAVA内存模型总结
- java中RSA加解密的实现
- Php基础数学运算篇
- 【转】Asp.net获取本周上周本月上月本年上年第一天最后一天时间大全
- 正则表达式:元字符、限定符、反义代码
- JAVA学习应该从哪方面着手呢?
- asp.net如何读写xml文件
- c# 对一下XML文档进行添加删改的实例
- 单例设计模式
- Delphi LoadUserProfile
- [蜂鸣器不简单]单片机中蜂鸣器的多种运用(长响,短响,多次响)
- HDU-1091-A+B for Input-Output Practice (III)(继续水)
- QT编程,如何使对话框总是最优化
- ASP.NET MVC 下拉框的传值的两种方式