欢迎您访问我爱IT技术网,今天小编为你分享的javascript教程:【jQuery动画效果-fadeIn fadeOut淡入浅出示例代码】,下面是详细的讲解!
jQuery动画效果-fadeIn fadeOut淡入浅出示例代码
<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="http://www.jb51.net/article/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>
关于jQuery动画效果-fadeIn fadeOut淡入浅出示例代码的用户互动如下:
相关问题:如何使用jquery里的.fadeIn()淡入效果让多个排列的...
答:菜鸟手册.posts {display: none;}jQuery (function ($) { myFade ($ (".posts:first")); }); var myFade = function (posts) { posts.fadeIn ("slow", function () { var nextOne = $ (this).next ('.posts'); if (nextOne.length > 0) { myFade... >>详细
相关问题:CSS2文字淡入淡出滑动的动画效果如何实现?
答:也可以用jquery,fadeIn(淡入),fadeOut(淡出),滑动效果用animate(),改变坐标值 >>详细
相关问题:jquery中想让一个div中添加的东西fadeIn,淡入显示...
答:直接在后面.fadeIn >>详细
- 【firefox】firefox浏览器不支持innerText的解决
- 【Extjs】Extjs学习过程中新手容易碰到的低级错误
- 【clearInterval】js clearInterval()方法的定义
- 【dom】javascript dom追加内容实现示例-追加内容
- 【checkbox】让checkbox不选中即将选中的checkbox
- 【Array】js中更短的 Array 类型转换-类型转换
- 【append】append和appendTo的区别以及appendChil
- 【ExtJs】ExtJs 表单提交登陆实现代码-表单提交-
- 【addClass】javascript自定义的addClass()方法
- 【Event】jquery下为Event handler传递动态参数的
- 评论列表(网友评论仅供网友表达个人看法,并不表明本站同意其观点或证实其描述)
-
