制作动画常用方法:

show("速度")   显示元素
   hide("速度")   隐藏元素
   toggle()       切换效果
例如下jQuery代码:

$(function () {
            $("#panel heah").toggle(function ()
            {
                $(this).next().hide();
            }, function ()
            {
                $(this).next().show();
            })
        })
   fadeOut() fadeIn() 这两个方法是改变元素的不透明度(实现隐藏和显示的效果)

例如下jQuery代码:
$(function () {
            $("#panel heah").toggle(function ()
            {
                $(this).next().fadeOut();
            }, function ()
            {
                $(this).next().fadeIn();
            })
        })
   slideUp() slideDown() 这两个方法是改变元素的高度
  例如下jQuery代码:
$(function () {
            $("#panel heah").toggle(function ()
            {
                $(this).next().slideUp();
            }, function ()
            {
                $(this).next().slideDown();
            })
        })
   自定义动画:animate(params,speed,function(){ })

params:一个包含样式属性及值的映射

speed:速度

function(){ }:在动画完成之后执行的方法

例如下jQuery代码:

$(function ()
        {
            $(document).click(function ()
            {
                $("#leftbox,#rightbox").animate({ width: -1 + "px" }, 4000, function ()    //将匹配元素的宽度改为-1px ,4秒完成此操作
                {
                    $("#coverbox").fadeOut(3000);       //当上一操作完成时,将再次匹配的元素慢慢隐藏 ,3秒完成此操作
                });
            });
            
        });

转载于:https://www.cnblogs.com/scc-/p/9512541.html

jQuery 中的简单动画相关推荐

  1. jQuery中的渐变动画效果

    jQuery中的渐变动画效果jQuery中的渐变动画效果 转载于:https://www.cnblogs.com/DreamDrive/p/5780292.html

  2. c语言中的简单动画(带有源码)

    c语言中的简单动画(带有源码) 动画 1. 怎样实现动画 相信大家已经对动画的原理已经不陌生了.想要目标物体动起来,只需要逐个播放目标物体每一时刻位 置的图片.只要播放的速度足够快,人们就会在视觉上认 ...

  3. jquery中的各种动画效果

    注: 所有的动画效果都可以指定3种速度参数:"slow". "normal" ."fast"(时间长度分别为0.6秒.0.4秒和0.2秒) ...

  4. 搞定动画之 JQuery 中的自定义动画

    古之立大事者,不惟有超世之才,亦必有坚忍不拔之志--苏轼 写在前面 所谓的自定义动画就是通过 jQuery 提供的方法来完成我们自己想要的动画效果 animate()方法 jQuery 提供了 ani ...

  5. jQuery中的动画

    一.基本动画 1.show()方法和hide()方法:改变display属性 为一个元素调用hide()方法,会将该元素的display样式改为"display:none". $( ...

  6. 四、jQuery 中的事件和动画(嘎嘎详细)

    文章目录 前言 一.事件 1.1 加载 DOM 1.1.1 执行时机 1.1.2 多次使用 1.1.3 简写方式 1.2 事件绑定 1.2.1简单使用 1.2.2 简写绑定事件 1.3 合成事件 1. ...

  7. jQuery 中的 Ajax

    jQuery 对 Ajax 操作进行了封装, 在 jQuery 中最底层的方法时 $.ajax(), 第二层是 load(), $.get() 和 $.post(), 第三层是 $.getScript ...

  8. JQuery源码-------JQuery中数值型变量的判断isNumeric

    判断一个数值型变量的方法,在jquery中非常简单,只有一行代码. isNumeric: function( obj ) {// parseFloat NaNs numeric-cast false ...

  9. .JQuery中的Ajax

    1.load()方法 (1)load()方法是jquery中最为简单和常用的ajax方法,能远程载入html代码并插入DOM中,它的结构为: load(url[,data] [,callback]) ...

最新文章

  1. 搭建WSS 开发测试环境
  2. 安装 SQL Server 商业解决方案模板
  3. IOS工作笔记(五)
  4. ssm路径访问不到_ssm整合!!!
  5. zookeeper是如何实现数据一致性的?
  6. 【计算机网络复习】1.1.2 标准化工作及相关组织
  7. SAP License:ERP实施如何防止内部信息泄露
  8. 如何更好地优化大数据分析
  9. struts2和hibernate的简单新闻发布系统_点赞!北斗卫星导航系统28nm工艺芯片已量产,全球范围定位精度优于10米...
  10. 运维分级发布_故障分级和处罚规范-运维必备规章制度
  11. Sematic Web 学习笔记---现代逻辑导论
  12. ubuntu 上交叉编译 linaro 的库
  13. 什么是CTP程序化交易:系统入门
  14. n阶乘计算器 超大数 理论可计算8位数以内的阶乘数
  15. python的Pmw库的安装
  16. 计算机网络 - 传输层
  17. win10进行系统还原 (可以还原注册表文件 还可以清除近期卸载不了的软件)
  18. python英汉互译词典下载_python字典如何实现英汉互译
  19. 某电信运营商客户是否会流失的预测分析
  20. 使用Eclipse开发Python

热门文章

  1. 电脑无法连接网络,未识别的网络
  2. obs-studio-node简单搭建rtmp推流软件demo
  3. 云话首次跨界合作 移动APP再推新潮
  4. screentogif能录制声音吗_藏玉问答:听声音也能辨别和田玉真假吗?
  5. NoSQL数据库入门概述
  6. fluent linux使用指南,Fluent 使用步骤指南 - 仿真模拟 - 小木虫 - 学术 科研 互动社区...
  7. XP定时自动开机/关机/启动
  8. 推荐两个搜索本地文件和文档内容的小工具
  9. 越位讲解——足球世界杯观看指南
  10. 元学习系列(零):小样本学习与元学习综述