JQuery

How to implement show, hide using JQuery?

How to implement show, hide using JQuery?, someone asked me to explain?
By:

JQuery offers capability to hide and show, this can be implemented using hide() and show() methods.

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>implementing hide and show using JQuery </title>
    <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
       $(document).ready(function () {
            $("#btnhide").click(function () {
               $("#divcontent").hide();
            });
            $("#btnShow").click(function () {
               $("#divcontent").show();
            });
        });
    </script>
</head>
<body>
    <div id="divcontent" style="border: 1px solid gray; width: 350px; height: 200px; background-color: #E91E63;">This is visible.</div>
    <input value="hide the content" type="button" id="btnhide" />
    <input value="show the content" type="button" id="btnShow" />
</body>
</html> 

Output:

How to implement hide/ show using JQuery?

Related Article

Post your comments / questions



Recent Article