zoukankan      html  css  js  c++  java
  • getstyle() 获取样式

    问题:在js动画中,如果元素设置了border,padding等,获取到的样式是盒子的样式,这样会影响动画的正常显示。

        

    解决方案一:在元素的行内添加样式  如 

    <div style="width=200px">
        
    <div>
    

    解决方案二:通过getstyle()方法获取样式

    <script type="text/javascript">
    //哪个元素
    //哪个样式
    
    function getStyle(obj, attr)
    {
     if(obj.currentStyle)
     {
      return obj.currentStyle[attr];
     }
     else
     {
      return getComputedStyle(obj, false)[attr];
     }
    }
    
    window.onload=function ()
    {
     var oDiv=document.getElementById('div1');
     
     alert(getStyle(oDiv, 'backgroundColor'));
    }
    </script>
    
     
    
    <div id="div1"></div>
    
     
    
     
    
    //获取样式简洁版
    function getStyle(obj, attr) {
    	return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj, false)[attr];
    }
    //opacity 设置透明度
    function setOpacity(elem, value) {
    	elem.filters ? elem.style.filter = 'alpha(opacity=' + value + ')' : elem.style.opacity = value / 100;
    }
    
    
    //完美版
    function css(obj, attr, value){
    	switch (arguments.length){
    		case 2:
    			if(typeof arguments[1] == "object"){
    				for (var i in attr) i == "opacity" ? (obj.style["filter"] = "alpha(opacity=" + attr[i] + ")", obj.style[i] = attr[i] / 100) : obj.style[i] = attr[i];
    			}else{
    				return obj.currentStyle ? obj.currentStyle[attr] : getComputedStyle(obj, null)[attr]
    			}
    			break;
    		case 3:
    			attr == "opacity" ? (obj.style["filter"] = "alpha(opacity=" + value + ")", obj.style[attr] = value / 100) : obj.style[attr] = value;
    			break;
    	}
    };
     
    

      

  • 相关阅读:
    vue去除#号tomcat配置
    vscode配置
    git忽略想要提交的文件
    vue-cli配置移动端自适应
    远程调试工具 -- weinre
    将博客搬至CSDN
    错误:this dependency was not found:'element-ui/lib/theme-chalk/index.css'。。。。。。。
    win上java1.7和1.8版本修改环境变量无效.md
    mysql 事务
    mysql 函数
  • 原文地址:https://www.cnblogs.com/yinzf/p/5432388.html
Copyright © 2011-2022 走看看