Ext.Element 类也定义了部分动画函数。我们先来看看Ext.Fx 类中的重要方法。

1、slideIn ( [String anchor], [Object options] ):

功能:滑入效果
值 说明
----- -----------------------------
tl 左上角
t 顶部中央
tr 右上角
l 左边中央
r 右边中央
bl 左下角
b 底部中央
br 右下角

Ext.onReady(function(){

Ext.get("a1").applyStyles({position: "absolute", top: 200, left: 200, backgroundColor: "red", width: 100, height: 100}).slideIn("r", {duration: 10}); })

2.slideOut ( [String anchor], [Object options] ):滑出效果,作动画隐藏。参数及用法同上
3、highlight ( [String color], [Object options] ):根据设置的颜色高亮显示Element 对象,
然后渐隐为原始颜色。默认情况,高亮显示的背景颜色为黄色。
参数:
color:起始颜色
options:选项配置
常见的配置选项及默认值
4、frame ( [String color], [Number count], [Object options] ):展示一个展开的波纹,伴随
着渐隐的边框以突出显示Element 对象。默认情况下展示的是一个淡蓝色的波纹。
参数:
color:波纹颜色
count:波纹的个数
options:选项配置
fadeIn ( [Object options] ):将元素从透明渐变为不透明。结束时的透明度可以根据"endOpacity"选项来指定。
6、fadeOut ( [Object options] ):将元素从不透明渐变为透明。结束时的透明度可以根据"endOpacity"选项来指定。
7、scale ( Number width, Number height, [Object options] ):以动画展示元素从开始的高度/宽度转换到结束的高度/宽度
8、shift ( Object options ):以动画展示元素任意组合属性的改变,如元素的尺寸、位置坐标和(或)透明度。如果以上属性中的任意一个没有在配置选项对象中指定则该属性不会发生改变。为了使该特效生效,则必须在配置选项对象中设置至少一个新的尺寸、位置坐标或透明度属性。
9.ghost ( [String anchor], [Object options] ):将元素从视图滑出并伴随着渐隐。作为可
选参数传入的定位锚点将被设置为滑出特效的结束点。

extjs的一些简单动画1的更多相关文章

  1. 原生JS封装简单动画效果

    原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...

  2. jquery添加光棒效果的各种方式以及简单动画复杂动画

    过滤器.绑定事件.动画   一.基本过滤器 语法 描述 返回值 :first 选取第一个元素 单个元素 :last 选取最后一个元素 单个元素 :not(selector) 选取去除所有与给定选择器匹 ...

  3. UIView简单动画

    UIView动态实现的效果有以下几种: 1.动态改变frame 2.动态改变color 3.动态改变alpha 4.动态改变bounds 首先,我们先看几种BasicView动画 #pragma ma ...

  4. IOS 简单动画 首尾式动画

    首尾式动画 首尾式动画即通过实现控件由初始状态到结束状态的过程.(主要表现在控件的Frame 透明度 ) // // ViewController.m // CX 简单动画 // // Created ...

  5. jQuery中自定义简单动画的实现

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...

  6. canvas制作简单动画

    在画布元素<canvas>中,除了绘制图形.图像.文字外,还可以制作一些简单的动画,制作过程十分简单,主要分为两步操作: 1.自定义一个函数,用于图形的移动或其他动作. 2.使用setIn ...

  7. Cocos2d-x 2.1.5 简单动画

    Cocos2d新版本函数更改了一些. 下面的代码可以产生一个简单动画. //第一步:生成动画需要的数据 CCTexture2D *texture=CCTextureCache::sharedTextu ...

  8. UI设计篇·入门篇·简单动画的实现,透明动画/旋转动画/移动动画/缩放动画,混合动画效果的实现,为动画设置监听事件,自定义动画的方法

    基本的动画构成共有四种:透明动画/旋转动画/移动动画/缩放动画. 配置动画的方式有两种,一种是直接使用代码来配置动画效果,另一种是使用xml文档配置动画效果 相比而言,用xml文档写出来的动画效果,写 ...

  9. python实现简单动画——生命游戏

    生命游戏 生命游戏的宇宙是一个无限的,其中细胞的二维正交网格,每个细胞处于两种可能的状态之一,即*活着*或*死亡*(分别是*人口稠密*和*无人居住*).每个细胞与它的八个邻居相互作用,这八个邻居是水平 ...

随机推荐

  1. 理解 QEMU/KVM 和 Ceph(1):QEMU-KVM 和 Ceph RBD 的 缓存机制总结

    本系列文章会总结 QEMU/KVM 和 Ceph 之间的整合: (1)QEMU-KVM 和 Ceph RBD 的 缓存机制总结 (2)QEMU 的 RBD 块驱动(block driver) (3)存 ...

  2. 证明你是你——快速开启Windows Azure多重身份验证

    中国版Windows Azure的多重身份验证(Multi-Factor Authentication)功能已经开放.这个功能说白了就是要“证明你是你”.目前可以支持以下几种验证方式: 手机,短信验证 ...

  3. Unity3D粒子系统 合集

    http://www.cnblogs.com/qinyuanpei/p/3659513.htmlhttp://www.cnblogs.com/qinghuaideren/p/3597666.html

  4. javascript按回车键触发事件

    <form id="search-form" > <input type="text" onkeypress="getKey();r ...

  5. fiddler和xampp安装成功后,网站打不开的原因

    fiddler和xampp安装成功后,网站打不开,出现403的错误 解决办法 编辑httpd.conf文件注释掉以下代码 #AllowOverride none # Require all denie ...

  6. React 学习笔记(一)

    React + es6 一.createClass 与 component 的区别 The API (via 'extends React.Component') is similar to Reac ...

  7. 一种Docker image镜像的取代方案

    在http://openvz.org/Download/templates/precreated中有很多压缩的镜像文件,可以将这些文件下载后采用import方式使用镜像,也可以采用我原来的博文:doc ...

  8. PHP-数组函数

    今天在写一个给第三方同步数据的接口时遇到一个这种情况,我有一大坨数据,但是第三方只需要其中的几个而已,不及思索的就开始foreach $ret = array(); foreach ($needPar ...

  9. iptables详细说明

    一:前言 防火墙,其实说白了讲,就是用于实现Linux下访问控制的功能的,它分为硬件的或者软件的防火墙两种.无论是在哪个网络中,防火墙工作的地方一定是在网络的边缘.而我们的任务就是需要去定义到底防火墙 ...

  10. Codevs 1229 数字游戏

    1229 数字游戏  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 白银 Silver     题目描述 Description Lele 最近上课的时候都很无聊,所以他发明了 ...