Home > Article > Web Front-end > What is show in jquery
What is show in jquery
- WBOYOriginal
- 2022-04-15 13:58:393428browse
In jquery, show is an effect method used to display hidden selected elements; the speed of element display can be set in parameters, specifying the speed of elements at different points of the animation, and during method execution The syntax of the function that needs to be executed after completion is "element object.show(speed,easing,callback)".
The operating environment of this tutorial: windows10 system, jquery3.2.1 version, Dell G3 computer.
What is show in jquery
The show() method displays hidden selected elements.
Note: show() applies to elements hidden via jQuery methods and display:none in CSS (not applicable to elements hidden via visibility:hidden).
Show hidden matching elements. This method is generally used to pop up a form, eg: click the registration button, and the registration page will pop up
This is the non-animated version of 'show(speed, [callback])'. If the selected element is visible, this method will not change anything. This method will work regardless of whether the element is hidden via the hide() method or display:none; is set in CSS.
Syntax
$(selector).show(speed,easing,callback)
speed Optional. Specifies the speed at which effects are displayed.
Possible values:
Milliseconds
"slow"
"fast"
-
easing Optional. Specifies the element's speed at different points in the animation. The default value is "swing".
Possible values:
"swing" - move slower at the beginning/end, faster in the middle
"linear" - move at a constant speed
Tip: More available easing functions are provided in the extension plug-in.
callback Optional. The function to be executed after the show() method is executed.
The example is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<script src="js/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$("p").hide();
});
$(".btn2").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<button class="btn1">隐藏</button>
<button class="btn2">显示</button>
<p>这是一个段落。</p>
</body>
</html>Output result:
Related video tutorial recommendations: jQuery video tutorial
The above is the detailed content of What is show in jquery. For more information, please follow other related articles on the PHP Chinese website!