首页 教程 API文档

css keyframes规则操作

2015-09-10 16:48:13

属性


使用频率
所属模块 Std.css
成员类型 静态成员函数

描述


Std.css.keyframes方法用于在当前文档中添加一个新的css keyframes动画,或者获取一个已经存在的指定名称的keyframes完整字符串.

当要读取的指定名称的keyframes不存在时,那么该方法会返回null

语法



String Std.css.keyframes(String name);
Object Std.css.keyframes(String name,Object rules);
        

参数


名称 类型 描述
name String keyframes的名称
rules Object

规则列表,百分比与css规则合集对应的Object对象,例如


{
    from:{
        color:"red",
        height:"50px"
    },
    50:{
        color:"blue",
        height:"100px"
    },
    to:{
        color:"green",
        height:"50px"
    }
}
                    

返回值


1. 读取到的keyframes字符串

2. this对象,通常情况下为Std.css

3. null

相关例子


添加一个keyframes


Std.css.keyframes("test1",{
    from:{
        color:"red",
        height:"50px"
    },
    50:{
        color:"blue",
        height:"100px"
    },
    to:{
        color:"green",
        height:"50px"
    }
});
        

读取keyframes


Std.css.keyframes("test1");
        

得到结果


@keyframes test1{
    50% {
        color: blue;
        height: 100px;
    }
    0% {
        color: red;
        height: 50px;
    }
    100% {
        color: green;
        height: 50px;
    }
}