zoukankan      html  css  js  c++  java
  • EXT核心API详解(六)Ext.Fx

    Ext.Fx类
    对于我这样的懒鬼而言,Fx类是核心类库中最激动人心的一个类,它不是最重要的,却是最实用的一个类
    定义了一些常用的特效方法,不妨自己多动手试试下面的方法,很有趣的

    fadeIn( [Object options] ) : Ext.Element
    渐显 options参数有以下属性
    callback:Function    完成后的回叫方法
    scope:Object        目标
    easing:String        行为方法 默认值是:easeOut,可选值在ext_base中找到,但没有说明,以下内容从yahoo ui中找到的
    easeNone:匀速
    easeIn:开始慢且加速
    easeOut:开始快且减速
    easeBoth:开始慢且减速
    easeInStrong:开始慢且加速,t的四次方
    easeOutStrong:开始快且减速,t的四次方
    easeBothStrong:开始慢且减速,t的四次方
    elasticIn:
    elasticOut:
    elasticBoth:
    backIn:
    backOut:
    backBoth:
    bounceIn:
    bounceOut:
    bounceBoth:
    太多,慢慢体会吧
    afterCls:String        事件完成后元素的样式
    duration:Number        事件完成时间(以秒为单位)
    remove:Boolean        事件完成后元素销毁?
    useDisplay:Boolean    隐藏元素是否使用display或visibility属性?
    afterStyle:String/Object/Function        事件完成后应用样式
    block:Boolean        块状化?
    concurrent:Boolean    顺序还是同时执行?
    stopFx :Boolean    当前效果完成后随合的效果是否将停止和移除

    fadeOut( [Object options] ) : Ext.Element
    渐隐 fadeOut和fadeIn能使用一个特别的endOpacity属性以指示结束时的透明度
    例:el.fadeIn({duration:5,endOpacity:0.7});

    frame( [String color], [Number count], [Object options] ) : Ext.Element
    边框变亮扩展然后渐隐
    例:el.frame("ff0000", 10, { duration: 3 })

    ghost( [String anchor], [Object options] ) : Ext.Element
    渐渐滑出视图,anchor定义
    tl     左上角(默认)
    t      上居中
    tr     右上角
    l      左边界的中央
    c      居中
    r      右边界的中央
    bl     左下角
    b      下居中
    br     右下角
    例:
    el.ghost('b', {
        easing: 'easeOut',
        duration: .5
        remove: false,
        useDisplay: false
    });

    hasActiveFx() : Boolean
    指示元素是否当前有特效正在活动

    hasFxBlock() : Boolean
    是否有特效阻塞了

    highlight( [String color], [Object options] ) : Ext.Element
    高亮显示当前元素
    例:el.highlight("ffff9c", {
        attr: "background-color", //can be any valid CSS property (attribute) that supports a color value
        endColor: (current color) or "ffffff",
        easing: 'easeIn',
        duration: 1
    });


    pause( Number seconds ) : Ext.Element
    暂停

    puff( [Object options] ) : Ext.Element
    吹,吹,吹个大气球,元素渐大并隐没
    例:el.puff({
        easing: 'easeOut',
        duration: .5,
        remove: false,
        useDisplay: false
    });

    scale( Number width, Number height, [Object options] ) : Ext.Element
    缩放
    例:el.scale(
        [element's width],
        [element's height], {
        easing: 'easeOut',
        duration: .35
    });

    sequenceFx()
    排队特效

    shift( Object options ) : Ext.Element
    位移,并可重置大小,透明度等
    例:
    el.shift({
        [element's width],
        height: [element's height],
        x: [element's x position],
        y: [element's y position],
        opacity: [element's opacity],
        easing: 'easeOut',
        duration: .35
    });

    slideIn( [String anchor], [Object options] ) : Ext.Element
    slideOut( [String anchor], [Object options] ) : Ext.Element
    滑入/滑出
    例:el.slideIn('t', {
        easing: 'easeOut',
        duration: .5
    });


    stopFx() : Ext.Element
    停止特效

    switchOff( [Object options] ) : Ext.Element
    收起并隐没
    例:
    el.switchOff({
        easing: 'easeIn',
        duration: .3,
        remove: false,
        useDisplay: false
    });


    syncFx() : Ext.Element
    异步特效
  • 相关阅读:
    OSI安全体系结构
    PHP 二维数组根据相同的值进行合并
    Java实现 LeetCode 17 电话号码的字母组合
    Java实现 LeetCode 16 最接近的三数之和
    Java实现 LeetCode 16 最接近的三数之和
    Java实现 LeetCode 16 最接近的三数之和
    Java实现 LeetCode 15 三数之和
    Java实现 LeetCode 15 三数之和
    Java实现 LeetCode 15 三数之和
    Java实现 LeetCode 14 最长公共前缀
  • 原文地址:https://www.cnblogs.com/meetrice/p/1206048.html
Copyright © 2011-2022 走看看