BUI

其它版本:

API for BUI 1.5.1

Show:

bui.toggle Class

常用动画切换器,只能运行已经配置好的动画,更多效果需要引入animate.css 外部样动画库

预览地址: demo

option: 获取设置参数
widget: 获取依赖控件
show: 显示
hide: 隐藏
remove: 移除
isShow: 显示状态 since 1.3.5

Constructor

bui.toggle

(
  • id
  • effect
  • inOrder
)

Parameters:

  • id String

    [要操控的元素的选择器]

  • effect String

    [内置的效果, none (无动画) | showIn(无动画) | fadeIn | fadeInLeft | fadeInRight | fadeInDown | fadeInUp | zoomIn | bounceIn | rotateIn | flipInX | flipInY]

  • inOrder Boolean

    [ 是否按顺序出场, 默认:false (从哪进,就从哪出) ->进 <-出 | true (顺着进来的方向出) ->进 ->出 ]

Example:

 方法1: 

         //初始化page对象
     var uiToggle = bui.toggle("#page");

         //显示动画
         uiToggle.show();

         //隐藏动画
         uiToggle.hide();

 方法2:

     var uiToggle = bui.toggle({ id:"#page" ,effect:"fadeInLeft"});
         uiToggle.show();
         uiToggle.hide();

 方法3: 自定义动画库里面没有的动画

     var uiToggle = bui.toggle("#page");
         uiToggle.show("fadeInLeft");
         uiToggle.hide("fadeOutLeft");

Item Index

Methods

destroy

(
  • [bool]
)

[销毁控件]

Parameters:

  • [bool] Boolean optional

    [ 默认: false 销毁部分 | true 销毁全部 ]

Example:

       //销毁
       uiToggle.destroy();

hide

(
  • [callback|effect]
  • [effect]
)
chainable

隐藏动画

Parameters:

  • [callback|effect] Function | String optional

    [1.5.1回调]

  • [effect] String optional

    [1.5.1 指定单次隐藏动画效果]

Example:

      var uiToggle = bui.toggle("#page");
          uiToggle.hide();

isShow

()

当前元素的显示状态

Example:

      var uiToggle = bui.toggle("#page");
          uiToggle.isShow();

option

(
  • [key]
  • [value]
)
chainable

获取设置参数

Parameters:

  • [key] String | object optional

    [ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数 ]

  • [value] String | number | boolean | function optional

    [ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传 ]

Example:

       //获取所有参数
        //获取所有参数
       var option = uiToggle.option();

       //获取某个参数
       var id = uiToggle.option( "id" );

       //修改一个参数
       uiToggle.option( "time",10 );

       //修改多个参数
       uiToggle.option( {"time":10} );

remove

() chainable

删除动画元素

Example:

      var uiToggle = bui.toggle("#page");
          uiToggle.remove();

show

(
  • [callback]
  • [effect]
)
chainable

显示动画

Parameters:

  • [callback] Function | String optional

    [1.5.1 回调]

  • [effect] String optional

    [1.5.1 指定单次显示动画效果]

Example:

      var uiToggle = bui.toggle("#page");
          uiToggle.show();

widget

(
  • [name]
)

获取依赖的控件

Parameters:

  • [name] String optional

    [ 依赖控件名 ]

Example:

       //获取依赖控件
       var uiToggleWidget = uiToggle.widget();