<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title></title>

		<style>

			div {

				width: 200px;

				height: 200px;

				background: orange;

				display:none;

			}

		</style>

		<script src="jquery-2.2.4.min.js"></script>

		<script>

			$(document).ready(function() {

					$('#bt1').on('click', function() {

						$('p').toggle(1000);

					})

					$('#bt_fade_in').on('click',function(){

						$('#div_fade_in').fadeIn(1000);

					});

					$('#bt_fade_out').on('click',function(){

						$('#div_fade_in').fadeOut(1000);

					});

					$('#bt_fade_to').on('click',function(){

						$('#div_fade_in').fadeTo(1000,.5);

					});

			});

		</script>

	</head>

	<body>

		<p>被隐藏对象</p>

		<button id="bt1">隐藏</button>

		<button id="bt_fade_in">fadeIn</button>

		<button id="bt_fade_out">fadeOut</button>

		<button id="bt_fade_to">fadeTo设置透明度</button>

		<br/>

		<div id="div_fade_in">FadeIn</div>

	</body>

</html>

　//除此之外还有slideDown, slideup, 每个动画都有一个执行完毕后的回调函数

jQuery 常用动画的更多相关文章

  1. jquery-12 jquery常用动画效果有哪些

    jquery-12 jquery常用动画效果有哪些 一.总结 一句话总结:jquery可以用户animate()自定义动画,也可以slide和fade系列方法来设置动画. 1.动画效果如何设置执行时间 ...

  2. JQuery常用动画实现函数

    1.上拉.下拉和切换 slideup().slidedown().slideToggle() JQuery里面的切换太吊了,它自带判断当前显示状态,如果为显示就执行隐藏,如果为隐藏就执行显示. 2.淡 ...

  3. jQuery的动画处理总结

    最近一年多一直在做前端的东西,由于老板在追求一些年轻动感的效果,让页面元素不能仅仅是简单的隐藏显示,所以经常会使用一些动画效果,发现jQuery的动画真心好用啊,把常用的几个总结一下,希望不再每次使用 ...

  4. JQuery常用实用的事件[较容易忽略的方法]

     JQuery常用实用的事件 注:由于JQuery片段较多就没有用插入代码文本插入,请见谅!JQuery 事件处理ready(fn)代码: $(document).ready(function(){ ...

  5. jquery常用函数与方法汇总

    1.delay(duration,[queueName]) 设置一个延时来推迟执行队列中之后的项目. jQuery1.4新增.用于将队列中的函数延时执行.他既可以推迟动画队列的执行,也可以用于自定义队 ...

  6. JQuery常用API 核心 效果 JQueryHTML 遍历 Event事件

    JQuery 常用API 参考资料:JQuery 官网   jQuery API 中文文档 核心 jQuery 对象 jQuery() 返回匹配的元素集合,无论是通过在DOM的基础上传递的参数还是创建 ...

  7. 10个非常炫酷的jQuery相册动画赏析

    我们经常可以在网页上看到形式各异的jQuery相册插件,由于现在浏览器对HTML5和CSS3的兼容越来越好了,所以很多jQuery相册插件都运用了CSS3的相关特性,形成了许多炫酷的动画特效.本文收集 ...

  8. 05-老马jQuery教程-动画

    前言 jQuery的动画系统做的非常出色,而且把最常用的显示.隐藏.淡入淡出.滑动显示和折叠凳效果都做了很好的封装.跟jQuery的选择器和事件配合起来,可以实现很多很绚的效果,而且简单易用兼容性好. ...

  9. 关于jquery所有动画都有速度和动画的方向(在宽度方向上的动画)?

    不只是jquery的 animate 动画, 才有时间的 参数, 实际上, 在所有的动画中, 包括: show/hide/toggle, slideup/slidedown/slidetoggle, ...

随机推荐

  1. shell脚本基础知识

    虽然现在能在Linux系统下生存,但是自觉效率太低,和高手有很大的差距. 这就是关于Linux的知识太过匮乏,有很多事情知道该怎么做,但是就是没法在Linux下实现,为了提升工作效率,必须要接触Lin ...

  2. iconv 文件编码相互转换

    iconv 文件编码相互转换 示例: iconv -f utf-8 -t gbk ~/a.txt > ~/b.txt -f 从哪种格式转换 -t 要转换到哪种格式 a.txt要转换的文件 b.t ...

  3. ios CoreBluetooth 警告 is being dealloc'ed while pending connection

    ios CoreBluetooth 警告 is being dealloc'ed while pending connection CoreBluetooth[WARNING] <CBPerip ...

  4. astyle 使用说明

    欢迎关注我的社交账号: 博客园地址: http://www.cnblogs.com/jiangxinnju GitHub地址: https://github.com/jiangxincode 知乎地址 ...

  5. robotframework笔记18

    测试执行 如何创建测试套件结构解析 执行测试数据,如何继续执行一个测试用例失败后, 以及如何优雅地停止整个测试执行. 执行流 执行测试套件和 总是在一个测试套件执行测试用例. 一个测试套件 创建从一个 ...

  6. robotframework笔记10

    循环和条件 for循环 *** Settings *** Library BuiltIn Library Collections *** Test Cases *** TestCase01 My Ke ...

  7. 101个MySQL 的调节和优化的提示

    MySQL是一个功能强大的开源数据库.随着越来越多的数据库驱动的应用程序,人们一直在推动MySQL发展到它的极限.这里是101条调节和优化MySQL安装的技巧.一些技巧是针对特定的安装环境的,但这些思 ...

  8. 杭JS

    杭JS的视频终于出来了.看了Garry Yao的视频依旧看不懂...总体上感觉是在职场上,我不在孤单了,勇敢的前进吧! 玉伯: 视频看了很多,什么情绪管理实践管理,最值得学习的就是知识管理定律了,找到 ...

  9. Touch ID集成

    作者感言 这个国庆由于种种原因, 过的不太安稳, 搬家, 办证, 东跑西跑, 忙的压根就不像是在过节....不过算了, 挑最后一天写写博文.最后:如果你有更好的建议或者对这篇文章有不满的地方, 请联系 ...

  10. charCodeAt 和 fromCharCode

    1.charCodeAt() 定义和用法 charCodeAt() 方法可返回指定位置的字符的 Unicode 编码.这个返回值是 0 - 65535 之间的整数. 方法 charCodeAt() 与 ...