找回密码
 立即注册
即日起,论坛关闭新用户注册和登录,论坛相关的贴子保留查阅和下载。获得授权后,有技术问题可联系微信 13199509559 一对一解决。 2024-3-12
查看: 3581|回复: 3
打印 上一主题 下一主题

【新手教程】不间断无缝向上滚动代码,兼容浏览器

2467

主题

2467

主题

2467

主题

管理员

易达创始人

Rank: 9Rank: 9Rank: 9

积分
30815
跳转到指定楼层
1#
admin_2 发表于 2014-5-14 20:09:49 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
发一个向上不间断滚动代码。
有需要的朋友可以拿去用。

[mw_shl_code=html,true]<div id="marquees" style="width:980px; height:185px; text-align:left; font-size:12px; color:#A7A7A7; overflow:hidden;">
<a href="#"class="a2">·易达WAP手机建站系统整合了微信和APP...</a>
<br />
</div>
<!-- 以下是javascript代码 -->
<script language="javascript">
<!--
marqueesHeight=185; //内容区高度
stopscroll=false; //这个变量控制是否停止滚动
with(marquees){
noWrap=false; //这句表内容区不自动换行
style.width=200; //于是我们可以将它的宽度设为0,因为它会被撑大
style.height=marqueesHeight;
style.overflowY="hidden"; //滚动条不可见
onmouseover=new Function("stopscroll=true"); //鼠标经过,停止滚动
onmouseout=new Function("stopscroll=false"); //鼠标离开,开始滚动
}
//这时候,内容区的高度是无法读取了。下面输出一个不可见的层"templayer",稍后将内容复制到里面:
document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');
function init(){ //初始化滚动内容
//多次复制原内容到"templayer",直到"templayer"的高度大于内容区高度:
while(templayer.offsetHeight<marqueesHeight){
templayer.innerHTML+=marquees.innerHTML;
} //把"templayer"的内容的“两倍”复制回原内容区:
marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
//设置连续超时,调用"scrollUp()"函数驱动滚动条:
setInterval("scrollUp()",20);
}
document.body.onload=init;
preTop=0; //这个变量用于判断滚动条是否已经到了尽头
function scrollUp(){ //滚动条的驱动函数
if(stopscroll==true) return; //如果变量"stopscroll"为真,则停止滚动
preTop=marquees.scrollTop; //记录滚动前的滚动条位置
marquees.scrollTop+=1; //滚动条向下移动一个像素
//如果滚动条不动了,则向上滚动到和当前画面一样的位置
//当然不仅如此,同样还要向下滚动一个像素(+1):
if(preTop==marquees.scrollTop){
marquees.scrollTop=templayer.offsetHeight-marqueesHeight+1;
}
}
-->
</script>     
[/mw_shl_code]

0

主题

0

主题

0

主题

中级会员

Rank: 3Rank: 3

积分
247
2#
kingfighters 发表于 2014-9-14 12:32:05 | 只看该作者
请问,我怎么使用啊?{date}

0

主题

0

主题

0

主题

中级会员

Rank: 3Rank: 3

积分
277
3#
kjli1nMa 发表于 2014-10-3 14:15:09 | 只看该作者
找了很久,在这找到了

0

主题

0

主题

0

主题

注册会员

Rank: 2

积分
185
4#
huxunwu 发表于 2014-10-8 13:41:52 | 只看该作者
YIDACMS技术论坛我在这学到了很多东西
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

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