您的位置：首页 > Web前端 > JQuery

jQuery显示隐藏动态效果的几种写法

2015-04-19 14:07 369 查看
<script type="text/javascript">
$(document).ready(function() {
/*$("#test1").click(function(){
$("#test2").toggle("fast",function(){

});
});*/
/* $("#test1").click(function(){
$("#test2").toggle(5000,function(){

});
}); */
/* $("#test1").toggle(function(){
$("#test2").show(5000,function(){});
},function(){
$("#test2").hide(5000,function(){});
}); */

/* $("#test1").click(function(){
$("#test2").slideToggle("slow");
});
*/

$("#test1").toggle(function(){
$("#test2").fadeTo(1000,0.3); //透明度
},function(){
$("#test2").fadeTo(1000,0);
});
});

</script>

<style type="text/css">

</style>
</head>

<body>
<div>
<ul>
<li id="test1">什么是jQuery?</li>
<ul id="test2" style="display: none;">
<li style="width: 200px; ">
jQuery是继prototype之后又一个优秀的Javascript库。
它是轻量级的js库 ，它兼容CSS3，还兼容各种浏览器
（IE 6.0+, FF 1.5+, Safari 2.0+,
Opera 9.0+），jQuery2.0及后续版本将不再
支持IE6/7/8浏览器。
</li>
</ul>
</ul>

</div>
</body>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航