jQuery .slideUp()方法向上滑动HTML元素
方法的三个参数都是可选的。滑动速度或者说动画持续时间，可以是数字(毫秒)或者是'fast','slow'等字符串。
动画速度为'fast'时候相当于200毫秒，同样'flow'相当于600毫秒。
如果没有指定速度则默认为400毫秒。
$.slideUp() 能够指定回调函数，当动画完成时执行该回调函数。html>
div {
text-align: center;
color: white;
font-size: xx-large;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 50px;
background-color: orange;
}
$(function() {
$("div#message").click(function(e) {
e.stopPropagation();
$("div#message").slideUp('fast');
});
$(document).click(function() {
$("div#message").slideDown('fast');
});
});
代码展示点击后段落向上滑动
$(document).ready(function(){
$("p").click(function () {
$(this).slideUp();
});
});
findsrc.com
findsrc.com
代码演示点击后DIV向上滑动
$(document).ready(function(){
$("div").click(function () {
$("div").slideUp();
});
});
代码演示点击按钮后缓慢slow向上移动并执行回调函数。
$(document).ready(function(){
$("button").click(function () {
$(this).parent().slideUp("slow", function () {
alert("done");
});
});
});
代码演示父元素缓慢向上滑动并执行回调函数。
$(document).ready(function(){
$("button").click(function () {
$(this).parent().slideUp("slow", function () {
alert("done");
});
});
});
代码展示向上滑动动画持续2000毫秒。
$(document).ready(function(){
$("div").click(function () {
$("div").slideUp(2000);
});
});
代码演示缓慢向上滑动。
$(document).ready(function(){
$("div").click(function () {
$("div").slideUp("slow");
});
});
DIV元素向上滑动，默认动画时间为400毫秒。
$(document).ready(function(){
$(document.body).click(function () {
if ($("div:first").is(":hidden")) {
$("div").show("slow");
} else {
$("div").slideUp();
}
});
});
Click me!
代码演示向上滑动并执行回调函数。
$(document).ready(function(){
$("button").click(function () {
$(this).parent().slideUp("slow", function () {
$("#msg").text($("button", this).text() + " has completed.");
});
});
});
Hide One
Hide Two
Hide Three
2357
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
