收藏本站腾讯微博新浪微博

经典论坛

 找回密码
 注册

QQ登录

只需一步,快速开始

蓝色理想 最新研发动态 网站开通淘帖功能 - 蓝色理想插件 论坛内容导读一页看论坛 - 给官方提建议

论坛活动及任务 地图和邮件任务 请多用悬赏提问 热夏来袭,选一款蓝色理想的个性T恤吧!

手机上论坛,使用APP获得更好体验 急需前端攻城狮,获得内部推荐机会 论坛开通淘帖功能,收藏终于可以分类了!

搜索
查看: 1630|回复: 4

[求助] 文字无缝滚动,想上他实现无限滚动,帮忙看看这段代码有什么问题?

[复制链接]
发表于 2013-8-5 14:54:30 | 显示全部楼层 |阅读模式

 提示:您可以先修改部分代码再运行

现在只滚动一下,不能无限循环滚动。求大神给看一下。
 楼主| 发表于 2013-8-5 16:16:53 | 显示全部楼层
没有改好别人写的,自己重新写了一个。不知道好不好,分享一下

 提示:您可以先修改部分代码再运行

回复 支持 反对

使用道具 举报

发表于 2013-8-5 16:55:58 | 显示全部楼层
dxhuii 发表于 2013-8-5 16:16
没有改好别人写的,自己重新写了一个。不知道好不好,分享一下[html]

看了一下你的代码,先不谈编码规范,就代码而言,你需要做的是一开始就向上滚动,所以没有必要开始给oUL定位
  1. oUl.style.top=aLi[0].offsetHeight*aLi.length+'px';
复制代码
默认的top为0就OK了,然后向上滚动即可。

这样就行
  1. // 我这里的代码当然是把SCRIPT放到页面底部
  2. (function(){
  3.         var oDiv=document.getElementById('a1');
  4.         var oUl=document.getElementById('a2');
  5.         var aLi=document.getElementsByTagName('li');
  6.         var speed=-1;
  7.        
  8.         oUl.innerHTML+=oUl.innerHTML;
  9.         oUl.style.top='0';
  10.        
  11.         function move(){
  12.                 if(oUl.offsetTop<-oUl.offsetHeight/2){
  13.                         oUl.style.top=0;
  14.                 }
  15.                
  16.                 oUl.style.top=oUl.offsetTop+speed+'px';
  17.         };
  18.        
  19.         var timer=setInterval(move,30);
  20.        
  21.         oDiv.onmouseover=function(){
  22.                 clearInterval(timer);
  23.         }
  24.        
  25.         oDiv.onmouseout=function(){
  26.                 timer=setInterval(move,30);
  27.         }
  28.        
  29. })();
复制代码


还有,如果使用setInterval函数的话,在你的move方法里最好判断一下timer,即使释放资源,所以最好这么处理:
  1. (function(){
  2.         var oDiv=document.getElementById('a1');
  3.         var oUl=document.getElementById('a2');
  4.         var aLi=document.getElementsByTagName('li');
  5.         var speed=-1;
  6.         var timer = null;
  7.        
  8.         oUl.innerHTML+=oUl.innerHTML;
  9.         oUl.style.top='0';
  10.        
  11.         function move(){
  12.                 if(timer){
  13.                         clearInterval(timer);
  14.                         timer = null;
  15.                 }
  16.                 if(oUl.offsetTop<-oUl.offsetHeight/2){
  17.                         oUl.style.top=0;
  18.                 }
  19.                
  20.                 oUl.style.top=oUl.offsetTop+speed+'px';
  21.                 timer=setInterval(move,30);
  22.         };
  23.        
  24.         timer=setInterval(move,30);
  25.        
  26.         oDiv.onmouseover=function(){
  27.                 if (timer) {
  28.                         clearInterval(timer);
  29.                         timer = null;
  30.                 }
  31.         }
  32.        
  33.         oDiv.onmouseout=function(){
  34.                 timer=setInterval(move,30);
  35.         }
  36.        
  37. })();
复制代码
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-8-5 17:08:26 | 显示全部楼层
yaohaixiao 发表于 2013-8-5 16:55
看了一下你的代码,先不谈编码规范,就代码而言,你需要做的是一开始就向上滚动,所以没有必要开始给oUL ...

嗯。谢谢。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2013-8-5 17:12:18 | 显示全部楼层
yaohaixiao 发表于 2013-8-5 16:55
看了一下你的代码,先不谈编码规范,就代码而言,你需要做的是一开始就向上滚动,所以没有必要开始给oUL ...

var aLi=document.getElementsByTagName('li');  这一句也是多余的了,你改过之后
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 注册

本版积分规则

QQ|小黑屋|Archiver|手机版|blueidea.com ( 湘ICP备12001430号 )  

GMT+8, 2020-7-13 13:23 , Processed in 0.140271 second(s), 7 queries , Gzip On, Memcache On.

Powered by Discuz! X3.2 Licensed

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表