• Javascript


    动画(Dynamic)

    JQuery动画必须是在标准文档下使用 否则可能引起动画时抖动或其它不可预知的结果,标准文档格式:

     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     

     

    动画函数
    show(speed, callBack)
    //speed:动画速度,可能的值有 slow(600毫秒)、fast(200毫秒)、normal(400毫秒)、自定义毫秒
    //callBack:回调,可选
    //以动画的方式显示事前被隐藏的元素

    hide(speed, callBack)

    //以动画的方式隐藏事前已经显示的元素

    fadeIn(speed, callBack)

    //在指定的时间内将该元素的透明度逐步增高

    fadeOut(speed, callBack)

    //在指定的时间内将该元素的透明度逐步减少(非隐藏)

    slideDown(speed, callBack)

    //将隐藏的元素以从上往下逐步展开的动画方式显示出来

    slideUp(speed, callBack)

    //将事前已经显示的对象以从下往上收拢的动画方式隐藏(table无效)

    toggle(speed)

    //切换元素的可见性

    slideToggle(speed)

    //如果该对象事前是显示的,则将该对象从下往上收拢直至隐藏,否则将该对象从上往下展开直至完全显示

    animate(params, speed, callBack)

    //params:匿名对象,用于设置元素的css,使该对象出现params指定的css动画效果

    stop(clear, goToEnd)

    //clear:指示是否清空还未执行的动画队列
    //goToEnd:指示是否直接将正在执行的动画跳转到末状态
    //如果参数不存在,会立即停止动画,如果接下来还有动画队列等待执行就继续执行下一个动画
    //示例:
    $('div').click(function () {

        $(this).animate({ 'left': '300' }, 1000);
    });
    $('div').click(function () {
        $(this).animate({ 'left': '-=300' }, 1000);
    });
    动画积累

    当用户不停的在一个动画对象上进行操作就会造成动画积累,可以使用is方法来测试该对象是否正处于动画状态,如果没有处于动画状态才为其添加动画,否则不执行任何操作

    $('p').mouseover(function () {
        if (!$('p').is(':animated')) {
            $(this).animate({ 'left': '+=200' }, 3000)
        }
    });

      

     

    Javascript - 学习总目录

  • 相关阅读:
    短信发送器小案例 smsManager
    短信大全小案例
    JavaScript学习总结(4)——JavaScript数组
    JavaScript学习总结(3)——JavaScript函数(function)
    JavaScript学习总结(2)——JavaScript数据类型判断
    JavaScript学习总结(2)——JavaScript数据类型判断
    JavaScript学习总结(1)——JavaScript基础
    JavaScript学习总结(1)——JavaScript基础
    Spring学习总结(6)——Spring之核心容器bean
    Spring学习总结(6)——Spring之核心容器bean
  • 原文地址:https://www.cnblogs.com/myrocknroll/p/6947468.html
Copyright © 2020-2023  润新知