JQuery 显示隐藏动画( show(),hide(),toggle() )

来源：互联网发布：java数据类型和运算符编辑：程序博客网时间：2024/05/16 17:11

$('#div1').show(1000); //显示。1000毫秒，表示动画显示过程时间。
$('#div1').hide(1000); //隐藏
$('#div1').toggle(1000); //合成显示隐藏

<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>    <title>显示隐藏动画</title><style>#div1 {width:100px; height:100px;background-color:black;}</style>    <script src="scripts/jquery-1.7.1.min.js"></script>    <script>        $(function() {//显示按钮            $('#btnShow').click(function(){//$('#div1').show();$('#div1').show(1000);  //1000毫秒，表示动画显示过程时间。});//隐藏按钮$('#btnHide').click(function(){//$('#div1').hide();$('#div1').hide(1000);});//合成按钮$('#btnTotal').click(function(){//$('#div1').toggle();$('#div1').toggle(1000);});        });    </script></head><body>    <input type="button" id="btnShow" value="显示"/>    <input type="button" id="btnHide" value="隐藏"/><input type="button" id="btnTotal" value="合成"/><div id="div1"></div></body></html>

阅读全文

0 0