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

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

  • 相关阅读:
    firewall&iptables
    Linux压缩&解压缩
    Centos7.4 修改selinux错误导致服务器起不来
    Anaconda 安装 pytorch报错解决方法
    Java8 map value排序
    SparkStreaming获取kafka数据的两种方式:Receiver与Direct
    vim常用的骚操作
    http server
    转:WinInet, WinHttp, Winsock, ws2_32的区别和联系
    windows xp 驱动开发(三)DDK与WDK WDM的区别
  • 原文地址:https://www.cnblogs.com/act262/p/4060980.html
Copyright © 2011-2022 走看看