jQuery动画效果-fadeIn fadeOut淡入浅出示例代码


Posted in Javascript onAugust 28, 2013
<html> 
<head> 
<meta charset="utf-8"/> 
<style> 
*{ margin:0; padding:0;} 
body{font-size:15px;} 
#container{ margin:60px; line-height:2em; width:300px; border:1px solid #CCC;} 
.head{ background:#999; padding:5px; cursor:pointer;} 
.content{ text-indent:15px;} 
</style> 
<script type="text/javascript" src="script/jquery-1.4.2.min.js"></script> 
<script> 
$(function(){ 
$("h5.head").toggle(function(){ 
$("div.content").fadeOut(3000); 
},function(){ 
$("div.content").fadeIn(3000); 
}); 
}) 
</script> 
</head> 
<body> 
<div id="container"> 
<h5 class="head">什么是jQuery?</h5> 
<div class="content"> 
JQuery是继prototype原型之后又一个javascript库,他凭借简单的代码和完善的浏览器兼容性,再加上强大的DOM操作,完善的事件处理机制,强大的ajax操作,加大的简化了javascript开发人员的工作。 
</div> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
event.X和event.clientX的区别分析
Oct 06 Javascript
js和as的稳定传值问题解决
Jul 14 Javascript
Jquery+Ajax+PHP+MySQL实现分类列表管理(上)
Oct 28 Javascript
JavaScript调用传递变量参数的相关问题及解决办法
Nov 01 Javascript
三种带箭头提示框总结实例
Jun 14 Javascript
js中的面向对象入门
Mar 06 Javascript
template.js前端模板引擎使用详解
Oct 10 Javascript
详解js的作用域、预解析机制
Feb 05 Javascript
详解关于element级联选择器数据回显问题
Feb 20 Javascript
javascript创建元素和删除元素实例小结
Jun 19 Javascript
关于layui 实现点击按钮添加一行(方法渲染创建的table)
Sep 29 Javascript
vue print.js打印支持Echarts图表操作
Nov 13 Javascript
Jquery 实现表格颜色交替变化鼠标移过颜色变化实例
Aug 28 #Javascript
Jquery仿淘宝京东多条件筛选可自行结合ajax加载示例
Aug 28 #Javascript
Jquery Uploadify多文件上传带进度条且传递自己的参数
Aug 28 #Javascript
ExtJS DOM元素操作经验分享
Aug 28 #Javascript
地址栏传递中文参数乱码在js里用escape转码
Aug 28 #Javascript
在JavaScript中实现类的方式探讨
Aug 28 #Javascript
实用的Jquery选项卡TAB示例代码
Aug 28 #Javascript
You might like
php实现图片缩放功能类
2013/12/18 PHP
yii操作cookie实例简介
2014/07/09 PHP
PHP中使用asort进行中文排序失效的问题处理
2014/08/18 PHP
用javascript实现读取txt文档的脚本
2007/07/20 Javascript
修改jQuery.Autocomplete插件 支持中文输入法 避免TAB、ENTER键失效、导致表单提交
2009/10/11 Javascript
HTML复选框和单选框 checkbox和radio事件介绍
2012/12/12 Javascript
JavaScript中最简洁的编码html字符串的方法
2014/10/11 Javascript
node.js中的console.trace方法使用说明
2014/12/09 Javascript
Bootstrap每天必学之附加导航(Affix)插件
2016/04/25 Javascript
浅谈javascript中的加减时间
2016/07/12 Javascript
jQuery 特性操作详解及实例代码
2016/09/29 Javascript
Angular中ng-options下拉数据默认值的设定方法
2017/06/21 Javascript
Vue组件通信实践记录(推荐)
2017/08/15 Javascript
js原生实现移动端手指滑动轮播图效果的示例
2018/01/02 Javascript
深入理解移动前端开发之viewport
2018/10/19 Javascript
Vue axios全局拦截 get请求、post请求、配置请求的实例代码
2018/11/28 Javascript
JS无限级导航菜单实现方法
2019/01/05 Javascript
vue+element 模态框表格形式的可编辑表单实现
2019/06/07 Javascript
微信小程序后端(java)开发流程的详细步骤
2019/11/13 Javascript
JavaScript事件循环及宏任务微任务原理解析
2020/09/02 Javascript
[01:04:05]Mineski vs TNC 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
[03:12]完美世界DOTA2联赛PWL DAY9集锦
2020/11/10 DOTA
[42:23]完美世界DOTA2联赛PWL S3 Forest vs Rebirth 第二场 12.10
2020/12/13 DOTA
python选择排序算法的实现代码
2013/11/21 Python
Python+matplotlib+numpy绘制精美的条形统计图
2018/01/02 Python
mac系统下Redis安装和使用步骤详解
2019/07/09 Python
python中的unittest框架实例详解
2021/02/05 Python
法国珠宝店:CLEOR
2017/01/29 全球购物
英国现代绅士品牌:Hackett
2017/12/17 全球购物
初中三年毕业生的自我评价分享
2014/02/14 职场文书
端午节活动策划方案
2014/03/09 职场文书
《鹬蚌相争》教学反思
2014/04/22 职场文书
服装设计专业自荐信
2014/06/17 职场文书
小学工作总结2015
2015/05/04 职场文书
教你在 Java 中实现 Dijkstra 最短路算法的方法
2022/04/08 Java/Android
Java实现贪吃蛇游戏的示例代码
2022/09/23 Java/Android