js 公告无间隔循环向上滚动

问题描述

公告栏里的公告列表向上滚动,是无间隔循环向上滚动的,不知道JS是怎么写的,谁有完整的例子吗, 谢谢大家.

解决方案

解决方案二:
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>无标题文档</title></head><body><divid="Div1"style="overflow:hidden;width:128px;height:100px;"><divid="Div2">a<br/>a<br/>a<br/>a<br/>a<br/>a<br/>a<br/>bccd</div><divid="Div3"></div></div><scriptlanguage="javascript">varspeed=30Div3.innerHTML=Div2.innerHTMLfunctionMarquee(){if(Div3.offsetTop-Div1.scrollTop<=0)Div1.scrollTop-=Div2.offsetHeightelse{Div1.scrollTop++}}varMyMar=setInterval(Marquee,speed)Div1.onmouseover=function(){clearInterval(MyMar)}Div1.onmouseout=function(){MyMar=setInterval(Marquee,speed)}</script></body></html>把上面的代码保存成一个网页,运行试试!~~~~无缝隙,自动循环!~~~
解决方案三:
<style>a{display:block;font-size:15px};</style><divid="div1"style="width:300px;height:68px;overflow:hidden"><ahref="javascript:">1,你可曾有过无数的梦想,</a><ahref="javascript:">2,却在时光的流逝里幻灭</a><ahref="javascript:">3,你可曾对未来期待憧憬,</a><ahref="javascript:">4,却在成长的岁月中迷失</a><ahref="javascript:">5,CSDN中国程序员论坛</a><ahref="javascript:">6,大家一起来</a><ahref="javascript:">7,好象都很不错的样子</a></div><script>vart=setInterval(myfunc,1000)vard=document.getElementById("div1")functionmyfunc(){varo=d.firstChildd.removeChild(o)d.appendChild(o)}d.onmouseover=function(){clearInterval(t)}d.onmouseout=function(){t=setInterval(myfunc,1000)}</script>2,<divid="marquees"><ahref="#">链接一</a><br><br><ahref="#">链接二</a><br><br><ahref="#">链接三</a><br><br><ahref="#">链接四</a><br><br></div><scriptlanguage="JavaScript">marqueesHeight=200;stopscroll=false;with(marquees){style.width=0;style.height=marqueesHeight;style.overflowX="visible";style.overflowY="hidden";noWrap=true;onmouseover=newFunction("stopscroll=true");onmouseout=newFunction("stopscroll=false");}document.write('<divid="templayer"style="position:absolute;z-index:1;visibility:hidden"></div>');preTop=0;currentTop=0;functioninit(){templayer.innerHTML="";while(templayer.offsetHeight<marqueesHeight){templayer.innerHTML+=marquees.innerHTML;}marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;setInterval("scrollUp()",10);}document.body.onload=init;functionscrollUp(){if(stopscroll==true)return;preTop=marquees.scrollTop;marquees.scrollTop+=1;if(preTop==marquees.scrollTop){marquees.scrollTop=templayer.offsetHeight-marqueesHeight;marquees.scrollTop+=1;}}</script>

解决方案四:

解决方案五:
楼上的可以的试试吧

时间: 2024-11-03 17:17:17

js 公告无间隔循环向上滚动的相关文章

基于JS实现新闻列表无缝向上滚动实例代码_javascript技巧

当新闻较多,并且空前有限的时候,使用滚动是一个不错的选择,本章节就通过代码实例介绍一下如何实现此效果. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>文字列表无缝向上滚动代码<

图片循环向上滚动效果

123 123 123 123 123 123 123 123

javascript 双行循环向上滚动效果

◇ 安理会改革拟新增七理事国 ◇ 国务院领导工作分工确定 ◇ 安理会改革拟新增七理事国 ◇ 国务院领导工作分工确定 ◇ 安理会改革拟新增七理事国 ◇ 国务院领导工作分工确定 ◇ 国务院领导工作分工确定

JS不间断向上滚动效果代码

 不间断向上滚动的效果,想必大家都有见到过吧,本文也为大家准备一个使用js实现的不间断向上滚动效果,感兴趣的朋友可以参考下 代码如下: <div id=demo style=overflow:hidden;height:139;width:232;background:#f4f4f4;color:#ffffff><div id=demo1><img src="12460764740.jpg"><img src="12460764741

二款不间断向上滚动代码

<div id=demo style=overflow:hidden;height:139;width:232;background:#f4f4f4;color:#ffffff> <div id=demo1> <img src="/down/js/images/12460764740.jpg"> <img src="/12460764741.jpg"> <img src="/images/1246076

js特效无缝文本图片向上连续滚动效果

1.中国WEB第一站? ,JS无缝垂直图片滚动,效果非常不错...图片特效 >>> JS无缝垂直图片滚动,效果非常不错 JS无缝垂直图片滚动,效果非常不错 2.网页制作教程? 从右向左滚动JavaScript图片滚动,看了一下代码,好像这方法挺简便的,容易修改,滚动无空隙,循环连续...图片特效向上无缝滚动的图片效果使一组图上无缝向上滚动的效果,用CSS定义滚动区域的大小与图片正好重叠 3.为什么要建立网站标准?什么是网站标准? 我们大部分人都有深刻体验,每当主流浏览器版本的升级,我们刚

jQuery实现简单的间隔向上滚动效果

 这篇文章主要介绍了jQuery实现简单的间隔向上滚动效果,实例分析了jQuery通过animate与setInterval控制dom元素滚动特效的技巧,需要的朋友可以参考下     本文实例讲述了jQuery实现简单的间隔向上滚动效果的方法.分享给大家供大家参考.具体实现方法如下: 代码如下: <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <

jQuery实现简单的间隔向上滚动效果_jquery

本文实例讲述了jQuery实现简单的间隔向上滚动效果的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> <div id="broadcast" class="bar" name="giftactive">  <

js实现文字、图片向上向左无缝滚动

文字或图片实现向上无缝滚动 <div id="colee" style="overflow:hidden;height:80px;">     <div id="colee1">            <li><a href="/">文字或图片实现向上无缝滚动</a></li>            <li><a href="/