手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery动画效果-fadeIn fadeOut淡入浅出示例代码
jQuery动画效果-fadeIn fadeOut淡入浅出示例代码
摘要:复制代码代码如下:*{margin:0;padding:0;}body{font-size:15px;}#container{margin:...

复制代码 代码如下:

<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>什么是jQuery?</h5>

<div>

JQuery是继prototype原型之后又一个javascript库,他凭借简单的代码和完善的浏览器兼容性,再加上强大的DOM操作,完善的事件处理机制,强大的ajax操作,加大的简化了javascript开发人员的工作。

</div>

</div>

</body>

</html>

【jQuery动画效果-fadeIn fadeOut淡入浅出示例代码】相关文章:

jQuery插件expander实现图片翻转特效

Javascript特效:随机显示图片的源代码

Jquery动态添加输入框的方法

JQuery分屏指示器图片轮换效果实例

JS函数实现鼠标指向图片后显示大图代码

Jquery中基本选择器用法实例详解

jQuery实现返回顶部效果的方法

jQuery实现首页图片淡入淡出效果的方法

jQuery聚合函数实例

JQuery自动触发事件的方法

精品推荐
分类导航