向上滚动的效果
<div id=demo style=overflow:hidden;height:150;width:90;background:#214984;color:#ffffff>
<div id=demo1>
<!-- 定义图片 -->
<img src="images/logo_1.gif">
<img src="images/logo/flashempire.gif">
<img src="images/logo.gif">
<img src="images/logo/5dmedia.gif">
<img src="images/logo/macromedia.gif">
<img src="images/logo/sucaiw.gif">
<img src="images/logo/blueieda.gif">
<img src="images/logo/htmlcn.gif">
<img src="images/logo/fwcn.gif">
</div>
<div id=demo2></div>
</div>
<script>
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>
制作向下滚动的效果,将上面“制作向上滚动的效果”中的红色字体Js部分替换成:
<script>
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:33;width:500;background:#214984;color:#ffffff>
<table align=left cellpadding=0 cellspace=0 border=0>
<tr>
<td id=demo1 valign=top><img src="images/logo_1.gif"><img src="images/logo/flashempire.gif"><img src="images/logo.gif"><img src="images/logo/5dmedia.gif"><img src="images/logo/macromedia.gif"><img src="images/logo/sucaiw.gif"><img src="images/logo/blueieda.gif"><img src="images/logo/htmlcn.gif"><img src="images/logo/fwcn.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>
制作向右滚动的效果,将上面“制作向左滚动的效果”中的红色字体Js部分替换成:
<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>
分享到:
相关推荐
图片连续滚动效果.rar图片连续滚动效果.rar图片连续滚动效果.rar图片连续滚动效果.rar图片连续滚动效果.rar图片连续滚动效果.rar
JavaScript图片连续滚动效果,共有4个效果(向下,向上,向左,向右)可根据需要选择
一个图片连续滚动的代码,类似于html中marquee效果,但是能够连续无间断的滚动
css3无缝连续滚动网页特效
js 特效 html 特效 连续滚动的图片 js 特效 html 特效 连续滚动的图片
通过js实现的新闻列表的滚动效果 效果为连续滚动
js 实现图片连续滚动效果
实现连续滚动文字效果,无间断,经过测试。小东西,不要笑我啊!
一、左右轮播,滚动持续0.6秒,滚动延迟3秒,滚动效果swing,初始焦点第1张,点选按键自动隐藏,按键边框半径(IE8-只方不圆)5px(以上各项为默认设置值) 二、上下轮播,滚动持续0.3秒,滚动延迟5秒,滚动效果...
连续滚动的图片 不间断。 <br>效果演示。
利用JavaScript制作无缝的连续滚动广告效果.pdf
在表格中插入图片,要有滚动效果,可以这样做....
jQuery连续滚动图片展示是一款类似传送带的图片连续循环滚动,鼠标移到图片则自动停止,移开又回自动滚动。
imgscroll插件是一款支持图片焦点滚动(支持渐变和滚动),图片连续无缝循环滚动的js库,依赖于jQuery图片无缝连续循环滚动 支持上下左右的滚动。
两种效果的图片滚动,包括演示,代码,需要插件,简单易用,功能强大,全部JS完成
主要为大家介绍了jQuery动画效果实现图片无缝连续滚动,实现类似连续不间断的滚动广告位,感兴趣的小伙伴们可以参考一下
最近我正在做一个播放器,想让歌曲...所以想了些办法让它不产生乱码,嘿嘿,并且成功啦,而且可以连续滚动,就是说第一次滚动没完,第二次又跟上了,就是这种连续滚动的效果,呵呵。。。希望能帮大家解决一点小小的问题
主要介绍了使用JavaScript实现连续滚动字幕效果的方法,文中给出了浏览器端运行的示例脚本,需要的朋友可以参考下
1286自带有垂直滚动,但是自带的垂直滚动并不是连续的等于形同虚设 本例是利用了LCD12864的绘图功能,通过对12864的读写操作实现的 1.本程序是原创程序,请尊重作者。 2.本程序可再开发性强 3.易读性强 本程序里面...
用JQuery写的,图片点击连续滚动的代码