最新的Web开发教程
 

jQuery效果 - 隐藏和显示


隐藏,显示,切换,滑动,淡入淡出,和动画。 哇!

点击显示/隐藏面板

因为时间非常宝贵,我们提供快速,方便的学习。

在w3ii,你可以学习你需要学习的一切,在方便和得心应手的格式。


例子

jQuery hide()
演示了一个简单的jQuery hide()方法。

jQuery的hide()
另一个hide()演示。 如何隐藏部分文本。


jQuery的hide()show()

使用jQuery,你可以隐藏和显示与HTML元素hide()show()方法:

$("#hide").click(function(){
    $("p").hide();
});

$("#show").click(function(){
    $("p").show();
});
试一试»

句法:

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

可选的速度参数指定隐藏/显示的速度,并可以采取以下值: "slow", "fast" ,或毫秒。

可选的回调参数是之后要执行的函数hide()show()方法完成(你将了解更多关于回调函数在后面的章节)。

下面的示例演示与速度参数hide()

$("button").click(function(){
    $("p").hide(1000);
});
试一试»

jQuery的toggle()

使用jQuery,您可以切换hide()show()的方法toggle()方法。

显示元素是隐藏的,隐藏的元素显示:

$("button").click(function(){
    $("p").toggle();
});
试一试»

句法:

$(selector).toggle(speed,callback);

可选的速度参数可以采取以下值: "slow", "fast" ,或毫秒。

可选的回调参数是后要执行的功能toggle()完成。


自测练习用!

练习1» 练习2» 练习3» 练习4»


jQuery效果参考

对于所有的jQuery效果的完整概述,请访问我们的jQuery效果参考