zoukankan      html  css  js  c++  java
  • js样式函数

    /**
    * 隐藏元素
    * @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;
    }

  • 相关阅读:
    !!!C#——进制转换!
    冒泡排序后用二分查找法查找位置
    简陋的4位验证码程序(范围内取随机数)
    这个年龄计算程序相当不科学,体验还是差差哒
    8.7课堂随笔
    字符串中查询关键字
    !汉企的WiFi网速好快
    重度强迫症患者的九九乘法表
    自选数字和范围的整除算法
    day52
  • 原文地址:https://www.cnblogs.com/1500418882qqcom/p/10627535.html
Copyright © 2011-2022 走看看