获取样式的简单的函数封装

        var CSS = {
            getStyle:function(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;
                }
            },
            getPageX:function(elem){//元素相对于整个文档的X位置
                return elem.offsetParent? elem.offsetLeft + CSS.getPageX(elem.offsetParent) : elem.offsetLeft;
            },
            getPageY:function(elem){//元素相对于整个文档的Y位置
                return elem.offsetParent? elem.offsetTop + CSS.getPageY(elem.offsetParent) : elem.offsetTop;
            },
            getParentX:function(elem){//元素相对于父亲的X位置
                return elem.parentNode === elem.offsetParent ? elem.offsetLeft : CSS.getPageX(elem) - CSS.getPageX(elem.parentNode);
            },
            getParentY:function(elem){//元素相对于父亲的Y位置
                return elem.parentNode === elem.offsetParent ? elem.offsetTop : CSS.getPageY(elem) - CSS.getPageY(elem.parentNode);
            },
            getPosX:function(elem){//元素相对于它的CSS容器的X位置
                return parseInt(CSS.getStyle(elem,"left"));
            },
            getPosY:function(elem){//元素相对于它的CSS容器的Y位置
                return parseInt(CSS.getStyle(elem,"top"));
            },
            setOpacity:function(elem,level){
                if(elem.filters){
                    elem.style.filters = ‘alpha(opacity=‘+level+‘)‘;
                }else{
                    elem.style.opacity = level/100;
                }
            }
        };

获取样式的简单的函数封装

时间： 2024-10-13 09:52:04

获取样式的简单的函数封装的相关文章

设置cookie、获取cookie、删除cookie函数封装

//设置cookie函数function setCookie(key,value,t){ var oDate = new Date(); oDate.setDate( oDate.getDate() + t ); document.cookie = key + '=' + encodeURI(value) + ';expires=' + oDate.toGMTString();} //获取cookie函数function getCookie(key){ //通过分号空格拆分开所有co

兼容的获取样式的函数getStyle()

想要得到某个元素的某个样式属性,可以用: 1 <div id="div01" style="color:red">123</div> 2 3 var ele = document.getElementById("div01"); 4 console.log(ele.style.color); 但这样只能得到写在元素上的行内样式,对于link进来的样式文件或<style></style>中写的样式是获

div盒子的缓动函数封装

1.2. 缓动动画 1.2.1. 原理公式动画公式 leader = leader + step 匀速动画公式 step = 定值 leader = leader + step 缓动动画公式 step = ( target - leader ) / 10 leader = leader + step 缓动动画的好处他的移动是有尽头的.不像基础匀速运动那样无限移动. 有非常逼真的缓动效果,实现的动画效果更细腻. 如果不清除定时器,物体永远跟着目标leader在移动. @体验缓动动

javascript 获取样式表里的属性值 currentStyle 和 getComputedStyle 的使用

很多时候我们要获取 CSS 样式表里面的值(非行间样式),而获取行间样式的属性值那么这用 obj.style.attr 就能获取得到,那么怎么样才能获取到CSS样式表里面的值呢,那么就要请出我们的主角 currentStyle 和 getComputedStyle ,简要的介绍一下他们,再封装一个函数来兼容各个浏览器. 介绍: currentStyle :这个属性是 IE 浏览器上使用的. getComputedStyle :这个方法是搞基浏览器上使用的. 封装: //这里的 obj 参数指

20150912 javascript事件-获取样式

<!doctype html> <html><head><meta charset="utf-8"><title>无标题文档</title><style> #div1{widht:200px;height:200px; background:#f00; border:4px solid black;}</style> <script> window.onload=function

原生JavaScript实现的图片轮播左右滑动效果函数封装

原生js实现的图片轮播左右滑动效果函数封装方便以后需要的时候拿出来复用. 适合新手学习使用. 使用方法轮播图的html结构就不多说了.不过有一点:为了实现无缝无限轮播,需要在三张图片的最前面和最后面再额外添加两张图片(见下),原理简单说就是当图片滑动到最后一张时立马跳到第二张,眼睛看上去就像前后无缝一样. 把img_slider.js引入html,然后编辑window.onload = (function () { ··· });中的内容. (获取图片床,按钮,标识等元素.然后调用slideI

变速动画函数封装增加任意一个属性

//计算后的样式属性---- 一个元素的任意的一个样式属性值function getStyle(element,attr) { //判断这个浏览器是否支持这个方法 return window.getComputedStyle?window.getComputedStyle(element,null)[attr]:element.currentStyle[attr];}//匀速动画function animate(element,attr,target) { //element--元素 attr-

C语言样式的文件操作函数

使用C语言样式的文件操作函数,需要包含stdio.h头文件. 1.打开文件的函数: 1 //oflag的取值为“w”或“r”,分别表示以写或读的方式打开 2 FILE* fd = fopen(filename.c_str(), oflag); 2.写文件的函数原型: size_t fwrite(const void* buffer, size_t size, size_t count, FILE* stream ); 其中buffer是需要向文件中写入的内容在内存中的首地址指针,size是待写入

dataSet==>Ilist<>的函数封装

一般我们用使用ADO.NET查询数据库返回泛型集合?使用SqlDataReader逐行读取数据存入对象代码 /// <summary> /// 获取UserInfo泛型集合 /// </summary> /// <param name="connStr">数据库连接字符串</param> /// <param name="sqlStr">要查询的T-SQL</param> /// <re