Jquery作者John Resig自己封装的常用函数

//获取元素的样式值。

function getStyle(elem,name){

    if(elem.style[name]){

        return elem.style[name];

    }

    else if(elem.currentStyle){

        return elem.currentStyle[name];

    }

    else if(document.defaultView&&document.defaultView.getComputedStyle){

        name=name.replace(/([A-Z])/g,"-$1");

        name=name.toLowerCase();

        var s=document.defaultView.getComputedStyle(elem,"");

        return s&&s.getPropertyValue(name);

    }

    else{

        return null

    }

}

   

//获取元素相对于这个页面的xy坐标。   

function pageX(elem){

    return elem.offsetParent?(elem.offsetLeft+pageX(elem.offsetParent)):elem.offsetLeft;

}

function pageY(elem){

    return elem.offsetParent?(elem.offsetTop+pageY(elem.offsetParent)):elem.offsetTop;

}

 

//获取元素相对于父元素的xy坐标。       

function parentX(elem){

    return elem.parentNode==elem.offsetParent?elem.offsetLeft:pageX(elem)-pageX(elem.parentNode);

}

function parentY(elem){

    return elem.parentNode==elem.offsetParent?elem.offsetTop:pageY(elem)-pageY(elem.parentNode);

}

   

//获取使用css定位的元素的xy坐标。

function posX(elem){

    return parseInt(getStyle(elem,"left"));

}   

function posY(elem){

    return parseInt(getStyle(elem,"top"));

}

    

//设置元素位置。   

function setX(elem,pos){

    elem.style.left=pos+"px";

}   

function setY(elem,pos){

    elem.style.top=pos+"px";

}

   

//增加元素Xy坐标。   

function addX(elem,pos){

    set(elem,(posX(elem)+pos));

}

function addY(elem,pos){

    set(elem,(posY(elem)+pos));

}

   

//获取元素使用css控制大小的高度和宽度   

function getHeight(elem){

    return parseInt(getStyle(elem,"height"));

}

function getWidth(elem){

    return parseInt(getStyle(elem,"width"));

}

   

//获取元素可能,完整的高度和宽度

function getFullHeight(elem){

    if(getStyle(elem,"display")!="none"){

        return getHeight(elem)||elem.offsetHeight;

    }

    else{

        var old=resetCss(elem,{display:"block",visibility:"hidden",position:"absolute"});

        var h=elem.clientHeight||getHeight(elem);

        restoreCss(elem,old);

        return h;

    }

}

function getFullWidth(elem){

    if(getStyle(elem,"display")!="none"){

        return getWidth(elem)||elem.offsetWidth;

    }

    else{

        var old=resetCss(elem,{display:"block",visibility:"hidden",position:"absolute"});

        var w=elem.clientWidth||getWidth(elem);

        restoreCss(elem,old);

        return w;

    }

}

   

//设置css,并保存旧的css

function resetCss(elem,prop){

    var old={};

    for(var i in prop){

        old[i]=elem.style[i];

        elem.style[i]=prop[i];

    }

    return old;

}

function restoreCss(elem,prop){

    for(var i in prop){

        elem.style[i]=prop[i];

    }

}

   

//显示和隐藏

function show(elem){

    elem.style.display=elem.$oldDisplay||" ";

}

function hide(elem){

    var curDisplay=getStyle(elem,"display");

    if(curDisplay!="none"){

             elem.$oldDisplay=curDisplay;

        elem.style.display="none";

    }

}

   

//设置透明度   

function setOpacity(elem,num){

    if(elem.filters){

        elem.style.filter="alpha(opacity="+num+")";

    }

    else{

            elem.style.opacity=num/100;

    }

}

   

//滑动   

function slideDown(elem){

    var h=getFullHeight(elem);

    elem.style.height="0px";

    show(elem);

    for(var i=0;i<=100;i+=5){

        new function(){

                  var pos=i;

                  setTimeout(function(){elem.style.height=(pos/100*h)+"px";},(pos*10));

        }

    }

}

   

//渐变

function fadeIn(elem){   

         show(elem);

         setOpacity(elem,0);

    for(var i=0;i<=100;i+=5){

        new function(){

                  var pos=i;

                  setTimeout(function(){setOpacity(elem,pos);},(pos+1)*10);

        }

    }

}

   

//获取鼠标光标相对于整个页面的位置。   

function getX(e){

    e=e||window.event;

    return e.pageX||e.clientX+document.body.scrollLeft;

}

function getY(e){

    e=e||window.event;

    return e.pageY||e.clientY+document.body.scrollTop;

}

   

//获取鼠标光标相对于当前元素的位置。

function getElementX(e){

    return (e&&e.layerX)||window.event.offsetX;

}

function getElementY(e){

    return (e&&e.layerY)||window.event.offsetY;

}

   

//获取页面的高度和宽度

function getPageHeight(){

    var de=document.documentElement;

    return document.body.scrollHeight||(de&&de.scrollHeight);

    }

function getPageWidth(){

    var de=document.documentElement;

    return document.body.scrollWidth||(de&&de.scrollWidth);

}

 

//获取滚动条的位置。

function scrollX(){

    var de=document.documentElement;

    return self.pageXOffset||(de&&de.scrollLeft)||document.body.scrollLeft;

}

function scrollY(){

    var de=document.documentElement;

    return self.pageYOffset||(de&&de.scrollTop)||document.body.scrollTop;

}

   

//获取视口的高度和宽度。   

function windowHeight() {

    var de = document.documentElement;

    return self.innerHeight||(de && de.offsetHeight)||document.body.offsetHeight;

}

 

function windowWidth() {

    var de = document.documentElement;

    return self.innerWidth||( de && de.offsetWidth )||document.body.offsetWidth;

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值