JS 在线客服在下拉后动态归位特效

如图，在线客服可以在下拉的时候动态归位，而不是直接使用positiong直接固定在侧边，今天来分享下JS代码，我也是摘录而已！

HTML：

div class="ydwpkefu" id="divQQbox">
     div class="title">
    客服可以在下拉的时候动态归位/div>
     div class="kfcontent">
    客服内容/div>
    /div>

CSS：

.ydwpkefu{
    Z-INDEX: 99;
     right: 2px;
     position: absolute;
     top: 140px;
}
    

JS：

//![CDATA[var tips;
     var theTop = 100/*这是默认高度,越大越往下*/;
     var old = theTop;
function initFloatTips() {
    tips = document.getElementById('divQQbox');
    moveTips();
}
    ;
function moveTips() {
    var tt=50;
if (window.innerHeight) {
pos = window.pageYOffset}
    else if (document.documentElement &
    &
 document.documentElement.scrollTop) {
pos = document.documentElement.scrollTop}
else if (document.body) {
    pos = document.body.scrollTop;
}
    pos=pos-tips.offsetTop+theTop;
    pos=tips.offsetTop+pos/10;
    if (pos  theTop) pos = theTop;
if (pos != old) {
    tips.style.top = pos+"px";
    tt=10;
    //alert(tips.style.top);
}
    old = pos;
    setTimeout(moveTips,tt);
}
    //!]]>
    initFloatTips();
    

动态效果对于企业站来说，还是挺能吸引访客眼球的，下拉时被眼球忽略的可能性比较低！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！