repl.it
@JerryTheMouse/

jQuery Book example

HTML, CSS, JS

No description

fork
loading
Files
  • index.html
  • script.js
  • source.txt
  • style.css
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
  <head>
    <title>Hello JQuery</title>
    <style>
      #helloDiv {
        background: #333;
        color: #fff;
        font-size: 24px;
        text-align: center;
        border-radius: 3px;
        width: 200px;
        height: 200px;
        display: none;
      }
    </style>
    <script src="http://code.jquery.com/jquery-1.11.2.min.js"></script>
  </head>
  <body>
    <button id="clickme">Click me!</button>
    <div id="helloDiv">Hello, JQuery!</div>
    <script>
      $( "#clickme" ).click(function () {
        if ( $( "#helloDiv" ).is( ":hidden" ) ) {
          $( "#helloDiv" ).slideDown( "slow" );
        } else {
          $( "div" ).hide();
        }
      });
  </body>
</html>
result
console
?