jQuery hide() Method – hide elements in a web page

The jQuery Hide method is used to hide one or more elements in your web page. This is similar to the CSS property display:none.

Syntax of jQuery Hide – .hide()

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

.hide() example: Hiding a div

See the below html code:

<div id="div1">
    Hello, How are you ?
</div>

To hide the div, the jQuery code will be:

$("#div1").hide();

.hide() example: Hiding a div with Callback function

Now I will hide the div by passing the callback function. This function will be called when the hide process is completed.

<div id="div2">
    Hello, How are you ?
</div>

So when the hide process gets completed then an alert box is shown.

$("#div2").hide(function () {
    alert("Hide method is completed!");
});

.hide() example: Hiding a div with ‘slow’ speed, ‘linear’ easing and ‘callback’ Method

Now in this example I will use all the 3 parameters of the jQuery hide method.

<div id="div3">
    Hello, How are you ?
</div>

The below .hide() code will do the hiding process in slow & linear manner then a callback function will be called after the hiding process is completed.

$("#div3").hide("slow", "linear", function () {
    alert("Hide method is completed!");
});

Download source code:

Download