随网页滚动条上下移动的效果 浮动QQ在线客服&网站QQ在线咨询

Code Snippet

<body>
<div style='visibility:visible;position:absolute;top:0;left:0;width:300px;height:180px;border:3px double #AAA' id='msgtip'></div>

<script>
// 浏览器类型获取.
if (typeof Platform == 'undefined') var Platform = {};
Platform.getUserAgent = navigator.userAgent;
Platform.isGecko = Platform.getUserAgent.indexOf("Gecko") != -1;
Platform.isOpera = Platform.getUserAgent.indexOf("Opera") != -1;
Platform.isIE = Platform.getUserAgent.indexOf("MSIE") != -1;

var LoginUI = !!window.LoginUI || {};

LoginUI.getViewportWidth = function(){
    var width=0;
    if(document.documentElement && document.documentElement.clientWidth){
    width=document.documentElement.clientWidth;}
    else if(document.body && document.body.clientWidth){
    width=document.body.clientWidth;}
    else if(window.innerWidth){
    width=window.innerWidth-18;}
    return width;
}

LoginUI.getContentHeight = function()
{
    if(document.body&&document.body.offsetHeight){
    return document.body.offsetHeight;
    }
}

LoginUI.getViewportHeight = function() {
    var height=0;
    if(window.innerHeight){
    height=window.innerHeight-18;}
    else if(document.documentElement&&document.documentElement.clientHeight){
    height=document.documentElement.clientHeight;}
    else if(document.body&&document.body.clientHeight){
    height=document.body.clientHeight;}
    return height;
}

LoginUI.getViewportScrollX = function(){
    var scrollX=0;
    if(document.documentElement&&document.documentElement.scrollLeft){
    scrollX=document.documentElement.scrollLeft;}
    else if(document.body&&document.body.scrollLeft){
    scrollX=document.body.scrollLeft;}
    else if(window.pageXOffset){
    scrollX=window.pageXOffset;}
    else if(window.scrollX){
    scrollX=window.scrollX;}
    return scrollX;
}

LoginUI.getViewportScrollY=function() {
    var scrollY=0;
    if(document.documentElement&&document.documentElement.scrollTop){
    scrollY=document.documentElement.scrollTop;}
    else if(document.body&&document.body.scrollTop){
    scrollY=document.body.scrollTop;}
    else if(window.pageYOffset){
    scrollY=window.pageYOffset;}
    else if(window.scrollY){
    scrollY=window.scrollY;}
    return scrollY;
}

LoginUI.getViewportScrollHeight=function() {
    var scrollH=0;
    if(document.documentElement && document.documentElement.scrollHeight){
    scrollH=document.documentElement.scrollHeight;}
    else{
    scrollH=document.body.scrollHeight;}   
    return scrollH;
}

LoginUI.centerDiv = function(div)
{
    var top=((LoginUI.getViewportHeight()-div.offsetHeight)/2);
    if(top<0)top=10;
    div.style.left=((LoginUI.getViewportWidth()-div.offsetWidth)/2)+"px";
    div.style.top=top+LoginUI.getViewportScrollY()+"px";
}

LoginUI.showLogin = function()
{   
    $("_userAuthImg").src = USERMGR_ROOT + "authimg?tmp=" + Date.parse(new Date());
    $("Login").className = "popup container";
    $("Login").style.display="block";
    LoginUI.centerDiv($("Login"));
    $("blockUI").style.display="block";
    $("blockUI").style.height = LoginUI.getViewportScrollHeight() + LoginUI.getViewportScrollY() + "px";
}

LoginUI.hideLogin = function()
{
    //$("Login").className = "popup container";
    //LoginUI.centerDiv($("Login"));
    $("blockUI").style.display="none";
    $("Login").style.display="none";
    //$("blockUI").style.height = LoginUI.getViewportScrollHeight() + LoginUI.getViewportScrollY() + "px";
}

function $(id)
{
 return document.getElementById(id)
}

function scrollMsgTip()
{
    var t = LoginUI.getViewportHeight() + LoginUI.getViewportScrollY() - $("msgtip").offsetHeight;
    if(!Platform.isIE)
    {
        t += 16;
    }
   
    $("msgtip").style.top = t + "px";
    $("msgtip").style.left = LoginUI.getViewportWidth() + LoginUI.getViewportScrollX() - $("msgtip").offsetWidth + "px";
}

function scrollTip()
{
    scrollMsgTip()
}

function preventEvents(event)
{
    try
    {
        if(Platform.isIE)
        {
            event.cancelBubble = true;
            event.returnValue = false;
        }
        else
        {
            event.stopPropagation();       
            event.preventDefault();
        }
    }
    catch(ex){}   
}


$("msgtip").innerHTML = "直接拷贝即可执行"
$("msgtip").style.visibility = "visible";
scrollTip();
window.onscroll = scrollTip;
</script>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
</body>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值