• jQuery 动画


    动画效果
    slideDown(100)下到上显示
    slideToggle(100)上到下显示
    slideUp(100)上到下隐藏
    fadeIn(100)淡淡显示
    fadeOut(100)淡淡显示
    fadeToggle()自动切换
    hide(100)右下角隐藏
    show(100)左上角显示
    animate({},100)自定义动画
    fast 200毫秒
    slow 600毫秒
    默认400毫秒
    toggle判断

    stop()取消动画效果

    列队动画方法

    使用回调函数,强行将.css()方法排队到.slideDown()之后
    $('#box').slideUp('slow').slideDown('slow',function(){
    $(this).css('background','orange');
    });

    使用.queue()方法模拟动画方法跟随动画方法之后
    $('#box').slideUp('slow').slideDown('slow').queue(function(){
    $(this).css('background','orange');
    });

    使用 next 参数来实现继续调用列队动画
    $('#box').slideUp('slow').slideDown('slow').queue(function(next){
    $(this).css('background','orange');
    next();
    }).hide('slow');

    使用顺序调用的列队,逐个执行,非常清晰
    $('#box').slideUp('slow');
    $('#box').slideDown('slow');
    $('#box').queue(function(){
    $(this).css('background','orange');
    $(this).dequeue();
    })
    $('#box').hide('slow');

    获取当前列队的长度,fx 是默认列队的参数
    functioncount(){
    return$("#box").queue('fx').length;
    }

    在某个动画处调用
    $('#box').slideDown('slow',function(){alert(count());});

    清理动画列队
    $('#box').slideDown('slow',function(){$(this).clearQueue()});

    动画相关方法

    强制停止运行中的
    stop(true,true);
    第一个参数表示是否取消列队动画,默认为 false。如果参数为 true,当有列队动 画的时候,会取消后面的列队动画。
    第二参数表示是否到达当前动画结尾,默认为 false。 如果参数为 true,则停止后立即到达末尾处。

    动画全局属性
    设置运行帧数为1000毫秒 默认为 13
    $.fx.interval=1000;

    设置动画为关闭 true 默认为 false
    $.fx.off=true;

  • 相关阅读:
    linux下搭建lamp环境以及安装swoole扩展
    TP5 中引入第三方类库
    thinkphp5 查询的数据是对象时,获取原始数据方法
    thinkphp5 列表页数据分页查询3-带搜索条件
    thinkphp5 列表页数据分页查询2-带搜索条件
    thinkphp5 列表页数据分页查询-带搜索条件
    thinkphp5 怎么获取当前的模块,控制器和方法名
    限定页面执行时间,请求超时抛出异常或提示
    centos安装netcat
    redis在PHP中的基本使用案例
  • 原文地址:https://www.cnblogs.com/xiukang/p/8968193.html
Copyright © 2020-2023  润新知