Javascript 向上滚动公告的代码示例

发布时间:2019-10-01编辑:脚本学堂
本篇文章介绍了,使用Javascript实现公告向上滚动的代码,不错的小例子,有需要的朋友,可以参考下。

代码如下:
 

复制代码 代码示例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
  <title>向上滚动公告-www.jb200.com</title>
</head>
<body>
<div style="width:400px;height:50px;overflow:hidden;background-color:red">
    <div id="noticev2" style="white-space:nowrap;" onmouseover="javascript:isMove=false" onmouseout="javascript:isMove=true">
    <a target="_blank" href="http://zhidao.baidu.com/question/42884976.html?fr=qrl">什么叫javascript</a><br>
    <a target="_blank" href="http://zhidao.baidu.com/question/41573038.html?fr=qrl">JavaScript 对表单的验证问题</a><br>
    <a target="_blank" href="http://zhidao.baidu.com/question/37308454.html?fr=qrl">JavaScript中event对象是做什么用的?</a><br>
    <a target="_blank" href="http://zhidao.baidu.com/question/35464099.html?fr=qrl">看看我这段JAVASCRIPT哪出问题了,为什么运行不了呢</a><br>
    <a target="_blank" href="http://zhidao.baidu.com/question/34079794.html?fr=qrl">JS表单验证 如何限制用户密码只能输入小写字母下划线...</a>
    </div>
</div>
<script>
var tID;
var tn;
var nStopTime=3000
var nSpeed=50
var isMove=true;
var nHeight=20;
var nS=0
var nNewsCount=0
function moveT(n) {
    clearTimeout(tID);
    var noticev2= document.getElementById("noticev2")
    if(n) {
        noticev2.style.lineHeight=nHeight+"px";
        var theText=noticev2.innerHTML.toLowerCase();
        nNewsCount=theText.split("<br>").length;
        noticev2.innerHTML+="<br>"+noticev2.innerHTML;
        tn=nHeight;
    }
    nS=nSpeed;
    if(isMove) {
        noticev2.style.marginTop=tn+"px";
        if((tn-2)%nHeight==0) {
            nS=nSpeed+nStopTime;
        }
        tn--;
        if(Math.abs(tn)==(nNewsCount*nHeight*2-nHeight)) {
            tn=(nNewsCount-1)*nHeight*-1;
        }
    }
    tID=setTimeout("moveT()",nS);
}
moveT(1);
</script>
</body>
</html>