jq-fadeIn&fadeOut:

<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>toggle<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>fadein&fadeout</title>

		<style>

			* {

				margin: 0;

				padding: 0;

			}

			button {

				font-size: 18px;

				padding: 0 19px;

			}

			#con {

				width: 500px;

				background: #ccc;

				color: red;

				font-size: 18px;

				overflow: hidden;

			}

		</style>

		<script src="js/jquery-1.8.3.js" type="text/javascript" charset="utf-8"></script>

	</head>

	<body>

		<button id="zk">展开</button>

		<button id="sq">收起</button>

		<div id="con">

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

			展开收起动画效果

		</div>

		<script type="text/javascript">

			$('#sq').click(function() {

//				$('#con').fadeOut();

				$('#con').fadeOut(3000);

			});

			$('#zk').click(function() {

//				$('#con').fadeIn();

				$('#con').fadeIn(3000);

			})

		</script>

	</body>

</html>

</title>

	</head>

	<body>

	</body>

</html>

　　

jq-fadeIn&fadeOut的更多相关文章

  1. 原生js模仿jq fadeIn fadeOut效果 兼容IE低版本

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. 移动表格行 解决低版本IE fadeIn fadeOut 失效问题

    在维护一个内部使用的web工具的时候,需要在表格里配置参数,并且支持参数列的上下移动,有jQuery-UI工具支持对表格列的拖动,但是此处不追求效果,而且旧系统页面兼容性很差,无奈只能做上下移动的按钮 ...

  3. jquery 中fadeIn,fadeOut动画

    我们在做首页banner图片播放的时候会使用fadeIn,fadeOut动画,这里需要注意的是: fadeIn作用相当于:display:list-item;opcity逐渐变为1 fadeOut作用 ...

  4. Zepto.js实现fadeIn,fadeOut功能

    Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jquery有着类似的api. 如果你会用jquery,那么你也会用zepto. Zepto的设计目的是提供 jQuery 的 ...

  5. ‎Cocos2d-x 学习笔记(11.9) FadeTo FadeIn FadeOut

    1. 用处 FadeTo:由正常变透明,是另两个的父类,不支持reverse()方法.FadeIn:变完全不透明.FadeOut:变完全透明. 2. 使用 FadeTo: GLubyte _toOpa ...

  6. transitionend事件 监听 fadeIn fadeOut 两个方法无效（动画结束时无法执行transitionend里面的代码）

    //下面的例子证明 fadeIn() fadeOut() 不能使用transitionend事件进行监听. //说白了在fadeIn fadeOut 后面监听动画结束时,transitionend是不 ...

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

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

  8. 简单css动画 fadeIn fadeOut flash

    考虑兼容性采用 -webkit- -o- -mos- -ms- @keyframes fadeIn{ 0%{ opacity: 0; display: block; } 100%{ opacity: ...

  9. CSS 3 过渡效果之jquery 的fadeIn ,fadeOut

    .div { visibility: hidden; opacity: 0; transition: visibility 0s linear 0.5s,opacity 0.5s linear; } ...

  10. [Angular] FadeIn and FadeOut animation in Angular

    To define an Angular Animation, we using DSL type of language. Means we are going to define few anim ...

随机推荐

  1. Linux-vim学习入门

    1.前言     vi/vim是linux中很重要的文本编辑器.我第一次使用这个编辑器时,很不习惯,甚至都不知道如何移动光标和插入字符.慢慢地经过学习,才知道如何使用vi/vim.     vi/vi ...

  2. Redis学习-Set

    在Redis中,Set类型是没有排序的字符集合,和List类型一样,可以在该类型的数据值上执行添加.删除或判断某一元素是否存在等操作.需要说明的是,这些操作的时间复杂度为O(1),即常量时间内完成次操 ...

  3. JAVA中LOCK

    原文链接:http://www.cnblogs.com/dolphin0520/p/3923167.html 一.synchronized的缺陷 我们知道如果一个代码块被synchronized修饰了 ...

  4. C#设置richtextbox某一段文本颜色

    假设 RichTextBox1 文本是"你好,我爱你中国",想要把中国变为红色,则 可以先找到中的位置是 7 :国的位置是8 设置 RichTextBox1.SelectionSt ...

  5. JSP----获取表单参数

    在页面中可大量使用 request 对象来获取表单域的值,获取表单域的值有如下两个 方法. • String getParamete(String para mN ame): 获取表单域的值. • S ...

  6. Lua学习(2)——表达式

    1. lua算术操作符lua支持的算数操作符: + - * /除 ^指数 %取模 -符号 2. lua关系操作符 <小于 >大于 <= >= == ~=不等于 3. 逻辑操作符 ...

  7. sh脚本异常,binsh^M bad interpreter No such file or directory

    错误 在Linux中执行.sh脚本,出现如下异常 /bin/sh^M: bad interpreter: No such file or directory 原因 在windows系统中编辑的.sh文 ...

  8. GPU编程--kernels（2）

    "如何区分不同的数据单位单位呢?" "如何确定程序是在CPU端执行,还是GPU端执行呢?" "如何确定要调用的GPU线程数呢?" 下面举一个 ...

  9. h5 + nginx + php 视频上传之突破文件大小受限的解决办法

    一.环境: CentOS 6.8 nginx 1.8.0 php 7.0.10 二.背景 基于 nginx + php 的 h5 项目,上传视频的时候,如果视频太大,会上传失败. 三.正文 一份视频传 ...

  10. 抓包工具-Wireshark（详细介绍与TCP三次握手数据分析）

    功能使用的详细介绍 wireshark(官方下载网站: http://www.wireshark.org/),是用来获取网络数据封包,可以截取各种网络封包,显示网络封包的详细信息,包括http,TCP ...