《精通javascript》几个简单的函数(二)

/* *
 * 隐藏元素
 * @param {String} elem
  */
function  hide(elem){
     var  curDisplay  =  getStyle(elem,  ' display ' );
    
     if (curDisplay  !=   ' none ' ){
        elem.oldDisplay  =  curDisplay;
    }
    elem.style.display  =   ' none ' ;
}

/* *
 * 显示元素
 * @param {String} elem
  */
function  show(elem){
    elem.style.display  =  elem.oldDisply  ||   ' block ' ;
}

/* *
 * 设置透明度
 * @param {Object} elem
 * @param {Object} level (0-100)
  */
function  setOpacity(elem, level){
     if (elem.filters){  // 如果是IE
        elem.style.filter  =   ' alpha(opacity= '   +  level  +   ' ) ' ;
         // 必须设置zoom,要不然透明度在IE下不生效  From:http://blog.csdn.net/dxx1988/article/details/6581430
        elem.style.zoom  =   1 ;
    }  else  {  // 否则是W3C
        elem.style.opacity  =  level  /   100 ;
    }
}

/* *
 * 滑动
 * @param {Object} elem
  */
function  slideDown(elem){
     // elem.style.height = '0px';
    
    show(elem);
     var  h  =  fullHeight(elem);
    
     for ( var  i = 0 ; i <= 100 ; i += 5 ){
        ( function (){
             var  pos  =  i;
            
            setTimeout( function (){
                elem.style.height  =  (pos / 100) * h + 'px';
            }, (pos  +   1 )  *   5 );
        })();
    }
}
// slideDown($('pText'));
// alert(fullHeight($('pText')));

/* *
 * 透明度渐显 From: http://mrthink.net/js-fadein-fadeout-fadeto/
 * @param {Object} elem
 * @param {Number} speed 淡入速度,正整数(可选)
 * @param {Number} opacity 淡入到指定的透明度,0~100(可选)
  */
function  fadeInThink(elem, speed, opacity){
    speed  =  speed  ||   20 ;
    opacity  =  opacity  ||   100 ;
    
    show(elem);
    setOpacity(elem,  0 );
     // 初始化透明度变化值为0
     var  val  =   0 ;
     // 循环将透明值以5递增,即淡入效果
    ( function (){
        setOpacity(elem, val);
        val  +=   5 ;
         if  (val  <=  opacity) {
            setTimeout(arguments.callee, speed)
        }
    })();

}


/* *
 * 透明度渐显
 * @param {Object} elem
  */
function  fadeIn(elem){
     // setOpacity(emel, 0);
    
    show(elem);
     for ( var  i = 0 ; i <= 100 ; i += 10 ){
        ( function (){
             var  pos  =  i;
            setTimeout( function (){
                setOpacity(elem, pos);
            }, (pos  +   1 )  *   10 );
        })();
    }
}

/* *
 * 透明度渐隐 From: http://mrthink.net/js-fadein-fadeout-fadeto/
 * @param {Object} elem
  */
function  fadeOut(elem){
     var  val  =   100 ;
    
    ( function (){
        setOpacity(elem, val);
        val  -=   5 ;
         if (val  >=   0 ){
            setTimeout(arguments.callee,  50 );
        }  else   if (val  <   0 ){
            hide(elem);
        }
    })();
}

// fadeInThink($('pText'));

/* *
* 光标的水平位置
* @param {Object} e
*/
function  getX(e){
    e  =  e  ||  window.event;
    
     return  e.pageX  ||  e.clientX  +  document.body.scrollLeft;
}

/* *
* 光标的垂直位置
* @param {Object} e
*/
function  getY(e){
    e  =  e  ||  window.event;
    
     return  e.pageY  ||  e.clientY  +  document.body.scrollTop;
}

/* *
 * 获得鼠标相对于当前元素的X位置
 * @param {Object} e
  */
function  getElementX(e){
     return  (e  &&  e.layerX)  ||  window.event.offsetX;
}

/* *
 * 获得鼠标相对于当前元素的Y位置
 * @param {Object} e
  */
function  getElementY(e){
     return  (e  &&  e.layerY)  ||  window.event.offsetY;
}

/* *
 * 当前页面的高度
  */
function  pageHeight(){
     return  document.body.scrollHeight;
}

/* *
 * 当前页面的宽度
  */
function  pageWidth(){
     return  document.body.scrollWidth;
}

// alert(pageHeight());

/* *
 * 视口的高度
  */
function  windowHeight(){
     var  de  =  document.documentElement;
    
     return  self.innerHeight  ||  (de  &&  de.clientHeight)  ||  document.body.clientHeight;
}

/* *
 * 视口的高度
  */
function  windowWidth(){
     var  de  =  document.documentElement;
    
     return  self.innerWidth  ||  (de  &&  de.clientWidth)  ||  document.body.clientWidth;
}

/* *
 * 浏览器水平滚动位置
  */
function  scrollX(){
     var  de  =  document.documentElement;
    
     return  self.pageOffsetset  ||   (de  &&  de.scrollLeft)  ||  document.body.scrollLeft;
}

/* *
* 浏览器垂直滚动位置
  */
function  scrollY(){
     var  de  =  document.documentElement;
    
     return  self.pageYOffset  ||  (de  &&  de.scrollTop)  ||  document.body.scrollTop;
}