javascript动画效果——获取样式

1.添加样式后效果会不一样的原因:obj.width获得是块的宽度,而obj.offsetWidth获得是块的宽度加上padding,border后的!所以执行obj.style.width=obj.offsetWidth-1=obj.style.width+borderWidth-1,当borderWidth>1时,其实这是在加宽度而不是减宽度

2.parseInt(),用于解析一个字符串,并返回一个整数,parseFloat()则返回的是一个浮点数

3.解决的方法有多种。不使用offsetWidth属性,直接用getElementById().style.width。不过有一个问题,就是为什么一定要把width放在body上,我觉得跟下面的一点有关系

4.用js的style属性可以获得html标签的样式,但是不能获取非行间样式。即: 用document.getElementById(‘element').style.xxx可以获取元素的样式信息,可是它获取的只是DOM元素style属性里的样式规则,对于通过class属性引用的外部样式表,就拿不到我们要的信息了。所以js用currentStyle和getComputedStyle获取css的非行间样式

5.对于currentStyle(针对IE)和getComputedStyle(针对火狐)

    function getStyle(obj,attr){
        if(obj.currentStyle){
            return obj.currentStyle[attr];
        }
        else{
            return getComputedStyle(obj,false)[attr];
        }
    }

6.上述两个方法可以获取CSS的属性,从而进行操控(这里没有详细学习)
7.Firefox,chrom浏览器的opacity属性使用的是小数,而IE使用的是整数(小数*100)。Math.round四舍五入!

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容