【示例】
-
HTML
<div id="id-div-slide"> <h3 class="h3-text">jQuery 效果 - 页面滑动操作</h3> <h3 class="h3-text">jQuery slideUp()函数/slideDown()函数 - 通过jQuery,用户可以使用toggle()函数来切换hide()和show()函数</h3> </div> <button id="btn-slideup">页面滑动隐藏</button> <button id="btn-sildedown">页面滑动显示</button>
-
JS
$(document).ready(function(){ $("#btn-slideup").click(function(){ $("#id-div-slide").slideUp("fast"); $("#div-log").html($("#div-log").html()+"<p>"+"slideUp()函数:通过使用滑动效果,隐藏被选元素"+"</p>"); }); $("#btn-sildedown").click(function(){ $("#id-div-slide").slideDown(1000); $("#div-log").html($("#div-log").html()+"<p>"+"slideDown()函数:通过使用滑动效果,显示隐藏的被选元素"+"</p>"); }); });