首页 > 技术文章 > 滚动条(附:定时调用)

gaomanito 2018-04-28 17:51 原文

CSS:

.rank{ width:88%;float:right;margin-left: 50px; height:50px; line-height:50px;  overflow:hidden; white-space:nowrap;position:absolute;}
.rank .rank_body{width:auto;font-size:16px; position: absolute; top:0; left:0; }

HTML:

<div class="rank" id="rank" onmouseover="clearInterval(timerRank)" onmouseout="timerRank=setInterval(mar,50)">
    <span class="rank_body" id="rank_body"></span>
</div>

JS:

//页面初始化
$(function(){
    //滚动条
    init();
}
 //滚动条
function init(){
   //第二个参数即 50 代表滚动速度 timerRank
=setInterval(mar,50); } function mar(){ var dp=$('#rank'),d=$('#rank_body'),l=d.position().left; if(Math.abs(l)<d.width()){ d.css('left',l-1); }else{ d.css('left',0); } }

 

附:定时调用

//页面初始化:
$(function(){
  
refreshData();
}
//定时调用
function refreshData(){
    //ajax方法
    ajaxWarnRank();
   //五分钟调用一次 setTimeout(refreshData,
300000); }

 

推荐阅读