码迷,mamicode.com
首页 > Web开发 > 详细

js 实现公告实时更新变动

时间:2020-04-02 18:00:36      阅读:118      评论:0      收藏:0      [点我收藏+]

标签:weight   col   实时   param   设置   hid   var   into   cti   

<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)
};

js 实现公告实时更新变动

标签:weight   col   实时   param   设置   hid   var   into   cti   

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

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!