zoukankan      html  css  js  c++  java
  • 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;

  • 相关阅读:
    第63天python学习异常
    第62天python 学习TCP三次握手四次挥手详解
    文件操作
    内置函数
    函数递归
    函数补充
    函数
    购物车程序作业
    集合内置函数
    字典三级菜单
  • 原文地址:https://www.cnblogs.com/xiukang/p/8968193.html
Copyright © 2011-2022 走看看