[原创] 效果与效率相结合随屏滚动广告代码

2016-07-07 15:41 来源：www.chinab4c.com 作者：ecshop专家

这段代码效果好，占资源特小，最重要的是调用非常方便！

适用于任何网页系统，针对ECSHOP 2.6如下实现

步骤1、将以下JS代码复制到网页任何地方，最好放到包含文件里头，这样一次复制，所有页面都可用了
（比如ECShop2.6可以放到/js/common.js 文件最后，其它网页都不用管了）
function _slide(id,delay)
{
_slide.Obj = document.getElementById(id);
_slide.Top = _slide.top = _slide.Obj.offsetTop;
_slide.Delay = delay;
_slide.AtRest = true;
window.onscroll = _slide.Float;
}
_slide.Float=function(process)
{
if(process || _slide.AtRest)
{
var dy = 0.1 * (_slide.top + document.documentElement.scrollTop - _slide.Top);
dy=dy>0 ? Math.ceil(dy) : Math.floor(dy);
if(dy)
{
_slide.AtRest = false;
_slide.Top += dy;
_slide.Obj.style.top = _slide.Top + "px";
_slide.Timer = setTimeout("_slide.Float(true)", _slide.Delay);
}
else
{
_slide.AtRest = true;
clearTimeout(_slide.Timer);
}
}
};

步骤2、调用随屏滚动，很简单
_slide(id,delay); // id 为需要随屏滚动的层，delay为滚动延时（毫秒，数字越小，滚动越快）
比如ECSHOP 2.6 某模板(官方green模板）可以在库项目page_header.lbi中增加这行

演示：http://www.qiqir.com 右侧在线客服随屏滚动效果（效果略有不同，进一步扩充了）

以上代码有个问题是：一个网页只能驱动一个随屏滚动条。当然，懂js的稍作修改就可以扩充了

回答：
多谢分享精神哩！

先留个位。呵呵