zoukankan      html  css  js  c++  java
  • JQuery UI 特效

    使用的特效的函数:

    隐藏元素 hide();

    显示元素 show();

    隐藏/显示元素 toggle();

    元素使用特效 effect();

    改变样式

    toggleClass();

    removeClass();

    addClass();

    语法

    写法一: .toggle( effect [, options ] [, duration ] [, complete ] )

    写法二: .toggle( options )

    参数:effect [String]

    blind(百叶窗),bounce(弹跳),drop(拖动),slide(滑动)

    explode(爆炸特效),fade(淡入淡出),fold(折叠),highlight(高亮),

    puff(膨胀),scale(缩放),pulsate(闪动),shake(震动)

    同样的,

    options [object]

    这个object里面使用key:value键值对方式

    {effect:“”,easing:“” duration:time, complete:callback ,queue:true/false }

     easing缓动效果,跟随变化曲线二变化的特效

    下面举个例子。。

    ========================================

     (粗体表示该效果独有的属性,带/的表示可能的取值,第一个为默认值)

    百叶窗特效:blind 

    写法1:$( "#toggle" ).toggle( "blind" ,2000);

    写法2:$( "#toggle" ).toggle({effect:"blind",duration:2000,direction:"up/down/left/right/vertical/horizontal"});

    反弹特效:bounce

    写法1:$( "#toggle" ).toggle( "bounce", { times: 3 }, "slow" );  类似这个特有的属性就作为一个options来作为参数

    写法2:$( "#toggle" ).toggle( {effect:"bounce",distance:50, times: 10 }, "2500" );

    写法3:$( "#toggle" ).toggle( {effect:"bounce",distance:50, times: 10 ,duration:2500} );

    剪辑特效:clip

    $( "#toggle" ).toggle( "clip" );

    $( "#toggle" ).toggle( {effect:"clip",direction:"vertical/horizontal" );

    。。。。。。其他的就不列举啦

  • 相关阅读:
    微软官方中英文Office2010SP1直接下载地址
    开源协议GUN LGPL
    VS2008安装失败!Microsoft Visual Studio Web 创作组件
    新的类型转换操作符(Type Conversion Operators)
    开源协议GNU GPL
    Visual Studio Ultimate 2012 RC 英文版
    两种老公,两种人生。
    开源协议Apache Licence 2.0
    VS2010 关于 CVT1100 和 LNK1123 的解决办法
    Apache Flink Streaming(DataStream API)
  • 原文地址:https://www.cnblogs.com/act262/p/4060980.html
Copyright © 2011-2022 走看看