js 实现公告实时更新变动

<div class="notice_active">    <ul>        <li><a href="">瑞灿科技直招网络人才 &nbsp;&nbsp; [2019-01-24]</a></li>        <li><a href="">瑞灿科技正在复工中欢迎广大人士应聘 &nbsp;&nbsp;[2020-02-24]</a></li>        <li><a href="">近日平顶山市又有一名患者被确诊 &nbsp;&nbsp; [2020-04-02]</a></li>    </ul></div>

.notice_active,ul li{margin: 0;padding: 0}.notice_active{    width:380px;    height: 35px;    padding: 0 30px;    background-color: #b3effe;    overflow: hidden;}.notice_active ul li{    list-style: none;    line-height: 35px;    /*以下是为了单行显示 ，超出隐藏*/    display: block;    white-space: nowrap;    text-overflow: ellipsis;    overflow: hidden;}

//公告实时更新/** * * @param obj:动画的节点 本例中是ul * @param top:动画的高度 本例中是-35px；注意向上滚动是负数 * @param time ：是滚动的速度 本例中设置3000毫秒 * function: 回调函数 每次动画完成，marginTop归零 并把此时第一条信息添加到列表后边 */function noticeUp(obj,top,time){    $(obj).animate({        marginTop:top    },time,function(){        $(this).css({marginTop:"0"}).find(":first").appendTo(this)    })}var MyMar=setInterval("noticeUp(‘.notice_active ul‘,‘-15px‘,1000)",3000);document.getElementsByClassName(".notice_active").onmouseover=function(){    clearInterval(MyMar);};document.getElementsByClassName(".notice_active").onmouseout=function(){    MyMar=setInterval("noticeUp(‘.notice_active ul‘,‘-15px‘,1000)",3000)};

原文地址：https://www.cnblogs.com/xiaokemo/p/12620994.html