JavaScript hide() method
JavaScript provides a method hide(), so that user can hide elements whenever they require. This function may be helpful when user wants to show some elements on any event and then required to hide them when action has been performed. In the following example code we have illustrated the use of hide() method by hiding a "Pop Up" item.
Syntax :
| elementObject.hide(); |
Where element object is the object onto which we have to perform hide() method. Let's understand the use of hide() with an example :
<html>
<head>
<title> Hide method </title>
<script language="JavaScript">
var popup;
function ShowPopup() {
popup = window.createPopup();
popup.document.body.style.backgroundColor = '#778899';
popup.document.body.innerHTML
="<div>HELLO ! Welcome to RoseIndia </div>";
popup.show(200,100,200,200,document.body);
}
</script>
</head>
<body>
<div style="background: #335556; width:'100%';"
align="center">
<font color="#ffddff" size="12pt">
<b>hide method example</b>
</font>
</div>
<center>
<input type="button" value="Show popup"
onclick="ShowPopup();">
<input type="button" value="Hide popup"
onclick="popup.hide();">
</center>
</body>
</html>
|
Here in the above code we have created two buttons. When user clicks on the first button it calls the function ShowPopup(). In this function we have first created a popup window by calling method window.createPopup(). After that we have added some inner text into it and then we have shown it by the method popup.show(). At last when user clicks on another button "Hide popup" it calls the method hide() on the popup element's object.
Output :
Click on the button "Show popup" to show popup element.
Click on another button "Hide popup" to hide popup window.
