动画
高级函数:基于底层函数又进行了封装
两大块:简化版的动画函数和万能动画函数
简化版动画函数
显示/隐藏$().show;  $(...).hide();
  强调:无参数的show()/hide()使用的是display属性
 瞬间隐藏和显示
 动画参数:speed:
 2种:1.三档: fast normal slow  慢中快 
            2.用毫秒数自定义
动画的速度变化:参数:easing:linear线性变化 swing摇摆属性先加速后减速

伸缩/折叠slideUp向上   slideDown向下  slideTogger()切换

淡入/淡出:fadeIn()淡进   fadeOut()淡出   fadeToggle();

 <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h1>jQuery动画函数-显示隐藏动画</h1>
<button id="bt1">隐藏DIV</button>
<!--div#target>p>lorem+Tab键-->
<div id="target">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium autem dicta doloribus eius fugit illum
ipsum, itaque laborum laudantium modi necessitatibus, nulla, numquam odio qui quisquam sequi temporibus tenetur
veniam?</p>
</div>
<script src="javascript/jquery-1.11.3.js"></script>
<script>
//为id为bt1的按钮绑定单击事件:
$("#bt1").click(function(){
$("#target").fadeToggle(500);
//toggle切换隐藏/显示效果
});
//让id为target的div隐藏
</script>
</body>
</html>

jQuery-淡入淡出效果-fadeIn()淡进 fadeOut()淡出 fadeToggle();的更多相关文章

  1. 原生JS实现淡入淡出效果(fadeIn/fadeOut/fadeTo)

    淡入淡出效果,在日常项目中经常用到,可惜原生JS没有类似的方法,而有时小的页面并不值得引入一个jQuery库,所以就自己写了一个,已封装, 有用得着的朋友, 可以直接使用. 代码中另附有一个设置元素透 ...

  2. JQuery显示,隐藏和淡入淡出效果

    为了把JQuery搞熟悉,看着菜鸟教程,一个一个例子打,边看边记,算是一晚上的一个小总结吧.加油,我很本但是我很勤奋啊.系统的了解它,就要花时间咯. <!DOCTYPE html> < ...

  3. jQuery学习四——效果

    1.显示,隐藏: <!DOCTYPE html> <html> <head> <title>jquery事件</title> </he ...

  4. Jquery小例子:全选按钮、加事件、挂事件;parent()语法;slideToggle()语法;animate()语法;元素的淡入淡出效果:fadeIn() 、fadeOut()、fadeToggle() 、fadeTo();function(e):e包括事件源和时间数据;append() 方法

    function(e): 事件包括事件源和事件数据,事件源是指是谁触发的这个事件,谁就是事件源(div,按钮,span都可以是事件源),时间数据是指比如点击鼠标的事件中,事件数据就是指点击鼠标的左建或 ...

  5. jQuery练手:仿新浪微博图片文字列表淡进淡出上下滚动效果

    1.效果及功能说明 仿新浪微博图片文字列表上下淡进淡出间歇上下滚动 2.实现原理 首先要设定div内只能显示4个图片那么多出来的图片会自动隐藏然后在给图片添加一个动画的事件让他们可以滚动的播放出来上下 ...

  6. jQuery 学习02——效果:隐藏/显示、淡入淡出、滑动、动画、停止动画、Callback、链

    jQuery 效果- 隐藏hide()和显示show() 语法: $(selector).hide(speed,callback);$(selector).show(speed,callback); ...

  7. jQuery淡入淡出效果轮播图

    用JavaScript做了平滑切换的焦点轮播图之后,用jQuery写了个简单的淡入淡出的轮播图,代码没有做优化,html结构稍微有一些调整,图片部分用ul替换了之前用的div. html结构如下: & ...

  8. 基于jquery实现的文字淡入淡出效果

    这篇文章介绍了jquery实现的文字淡入淡出效果实例,有需要的朋友可以参考一下 复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1 ...

  9. jQuery效果-----fadeIn()、fadeOut()、fadeToggle()、fadeTo()

    fadeIn(),fadeOut(),fadeToggle(),fadeTo() fadeIn()-----淡入已经隐藏的元素(把隐藏的被选元素渐渐显示出来). 语法:$(selector).fade ...

随机推荐

  1. 列表的pop()和路径拼接问题

    我竟然发现了新大陆,感觉对列表已经啥也不清楚了 #pop()删除最后一项 l=[1,2,3] a=l.pop(-1) print(a) print(l) 结果: 3 [1, 2] 练习题:计算文件夹的 ...

  2. 创建日志表记录DML操作和DDL操作

    创建一个日志表,记录dept表的DML操作 create table dept_log(logid number,type varchar2(50),logdate date,deptno numbe ...

  3. es基本查询相关的

    一.获取索引的mapping GET linewell_assets_mgt_es/lw_devices/_mapping

  4. eclipse背景色设置成护眼色(豆沙绿)

    1.点击windows -->preferences 2.展开Editors 3.选择自定义颜色 4.把色调调成:85 饱和度调成:123 亮度调成205 即可调成豆沙绿色了 然后点确定.

  5. POJ2274 Long Long Message 字符串

    正解:SA/哈希+二分 解题报告: 传送门! 啊先放下翻译,,,?大意就有两个字符串,求这两个字符串的最长公共子串 先港SA的做法趴 就把两个子串拼接起来,然后题目就变成了求后缀的最长公共前缀了 所以 ...

  6. numpy的searchsorted细品

      import numpy as np a= np.arange(20) pos_left = a.searchsorted(3)    #也可以写成np.searchsorted(a, 3), 注 ...

  7. Ngx_Lua使用分享

    2017年04月22日 20:05:21 阅读数:430 Nginx_Lua 1.1. 介绍 1.2. 安装 1.2.1. 安装JIT平台 1.2.2. NDK与Lua_module 1.2.3. 编 ...

  8. docker容器多服务(不推荐)

    1.最常用方式配置进程管理工具Supervisor 2.最简单的就是把多个启动命令放到一个启动脚本里面,启动的时候直接启动这个脚本 第一种方式: 1.构建基础镜像 FROM lmurawsk/pyth ...

  9. (转)Redis集群搭建与简单使用(最少需要 6个节点)

    介绍安装环境与版本 用两台虚拟机模拟6个节点,一台机器3个节点,创建出3 master.3 salve 环境. redis 采用 redis-3.2.4 版本. 两台虚拟机都是 CentOS ,一台 ...

  10. centos 卸载已安装的软件

    以mysql举例: 首先查询安装包: rpm -qa|grep mysql 查询到的一个结果为:mysql-community-libs-5.7.13-1.el6.x86_64 yum 删除 yum ...