Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <!--
- To change this license header, choose License Headers in Project Properties.
- To change this template file, choose Tools | Templates
- and open the template in the editor.
- -->
- <html>
- <head>
- <title>TODO supply a title</title>
- <meta charset="UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <style type="text/css">
- .wrap {
- width: 1280px;
- margin:0 auto;
- }
- .box {
- width: 300px;
- height: 300px;
- background: #43A6DF;
- color:white;
- margin:4px;
- padding:6px;
- }
- p {
- color: white;
- text-align: center;
- font-size: 20px;
- font-weight: bold;
- }
- .inp {
- border: 1px solid cadetblue;
- background: white;
- color:black;
- height:40px;
- padding:3px;
- width: 292px;
- font-size: 30px;
- }
- .subbtn {
- background: #2E3539;
- height: 30px;
- color: white;
- text-align: center;
- border: 1px solid black;
- width: 298px;
- margin-top:10px;
- }
- .answer p {
- margin-top: 20px;
- font-size: 32px;
- }
- </style>
- <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
- <script type="text/javascript">
- $(document).ready(function() {
- $(".subbtn").click(function() {
- var _input = $(".inp").val();
- if (_input < 0) {
- _input = _input * (-1);
- }
- if ((_input % 2) === 1) {
- $(".answer").html('<p>The number ' + _input + ' is odd.</p>');
- } else {
- $(".answer").html('<p>The number ' + _input + ' is even.</p>');
- }
- });
- });
- </script>
- </head>
- <body>
- <div class="wrap">
- <div class="box">
- <p>Write an expression that checks if given integer is odd or even.</p>
- <input type="text" name="input1" id="input1" class="inp" />
- <input type="submit" value="Check" name="submit1" class="subbtn"/>
- <div class="answer"></div>
- </div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement