Usage Examples of show and hide Methods in jQuery

This example analyzes the usage of the show and hide methods in jQuery. Shared for everyone's reference, as follows:

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
  <style type="text/css">
    *{font-size:12px;}
    div{width:600px;margin:auto;}
    #control{background-color:gold;padding:10px;}
  </style>
  <script src="../js/jquery-1.5.1.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    $(function () {
      $("#btnDisplay").click(function () {
        $("#message").show(3000);
      });
      $("#btnHide").click(function () {}}
        $("#message").hide(3000);
      });
    });
  </script>
</head>
<body>
  <div id="control">
    <input id="btnDisplay" type="button" value="Display div"> />
    <input id="btnHide" type="button" value="Hide div"> />
  </div>
  <div id="message">
    Difference between mouseover and mouseenter: div nested inside div. See notes. It is related to event bubbling.<br /> 
    The mouseover event will be triggered whether the mouse pointer passes through the selected element or its child elements <br> />
    The mouseenter event will be triggered only when the mouse pointer passes through the selected element (passing through child elements will not trigger the event).
  </div>
</body>
</html>

Readers who are interested in more about jQuery-related content can check the special topics on this site: 'Summary of jQuery Window Operation Techniques', 'Summary of jQuery Drag and Drop Effects and Techniques', 'Summary of jQuery Common Plugins and Usage', 'Summary of Ajax Usage in jQuery', 'Summary of jQuery Table (table) Operation Techniques', 'Summary of jQuery Extension Techniques', 'Summary of jQuery Common Classic Effects', 'Summary of jQuery Animation and Effects Usage', and 'Summary of jQuery Selector Usage'.

I hope the content described in this article will be helpful to everyone's jQuery programming design.

Statement: The content of this article is from the Internet, and the copyright belongs to the original author. The content is contributed and uploaded by Internet users spontaneously. This website does not own the copyright, has not been manually edited, and does not assume any relevant legal liability. If you find any content suspected of copyright infringement, please send an email to: notice#oldtoolbag.com (Please replace # with @ when sending an email for reporting, and provide relevant evidence. Once verified, this site will immediately delete the infringing content.)

Basic Tutorial