• 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" );

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

  • 相关阅读:
    网络流二十四题之魔术球问题
    网络流二十四题之P2764 最小路径覆盖问题
    网络二十四题 之 P2756 飞行员配对方案问题
    网络流 之 dinic算法
    网络流 之 增广路
    中南
    2249: Altruistic Amphibians 01背包的应用 + lh的简单图论 图转树求lca
    今日训练 搜索
    AD-logon workstation
    Centos7-docker安装
  • 原文地址:https://www.cnblogs.com/act262/p/4060980.html
Copyright © 2020-2023  润新知