Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <table class="table table-bordered" border="1" width="35%" cellpadding="0" cellspacing="0">
- <tbody>
- <tr>
- <td class="no"><div class="blank">8</div></td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no">1</td>
- <td class="no">3</td>
- </tr>
- <tr>
- <td class="no">9</td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"><div class="blank">1</div></td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no"></td>
- <td class="no">8</td>
- </tr>
- <tr>
- <td class="bb"></td>
- <td class="bb">1</td>
- <td class="brbb">5</td>
- <td class="bb"></td>
- <td class="bb">8</td>
- <td class="brbb"></td>
- <td class="bb"></td>
- <td class="bb"></td>
- <td class="bb"></td>
- </tr>
- <tr>
- <td class="no"></td>
- <td class="no">9</td>
- <td class="br"></td>
- <td class="no"><div class="blank">8</div></td>
- <td class="no"></td>
- <td class="br">7</td>
- <td class="no">4</td>
- <td class="no"></td>
- <td class="no">2</td>
- </tr>
- <tr>
- <td class="no"></td>
- <td class="no">6</td>
- <td class="br"></td>
- <td class="no"><div class="blank">9</div></td>
- <td class="no"></td>
- <td class="br">4</td>
- <td class="no"><div class="blank">1</div></td>
- <td class="no"><div class="blank">8</div></td>
- <td class="no"></td>
- </tr>
- <tr>
- <td class="bb"></td>
- <td class="bb">8</td>
- <td class="brbb"></td>
- <td class="bb">2</td>
- <td class="bb"></td>
- <td class="brbb"></td>
- <td class="bb">7</td>
- <td class="bb">9</td>
- <td class="bb"><div class="blank"></div></td>
- </tr>
- <tr>
- <td class="no"></td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no">6</td>
- <td class="no">9</td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no">2</td>
- <td class="no"></td>
- </tr>
- <tr>
- <td class="no"></td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no">1</td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no"></td>
- <td class="no"></td>
- </tr>
- <tr>
- <td class="no"></td>
- <td class="no"></td>
- <td class="br">8</td>
- <td class="no">5</td>
- <td class="no"></td>
- <td class="br"></td>
- <td class="no"></td>
- <td class="no"></td>
- <td class="no">1</td>
- </tr>
- </tbody>
- </table>
- <input type='button' id='hideshow' value='Show/Hide Answer'>
- <script src="https://code.jquery.com/jquery-1.4.2.js"></script>
- <script>
- jQuery(document).ready(function(){
- jQuery('#hideshow').live('click', function(event) {
- jQuery('.blank').toggle('show');
- });
- });
- </script>
- <style>
- td > .blank{
- display:none;
- color:#fff;
- font-weight: 800;
- font-size:20px;
- padding: 1px;
- background-color:red;
- }
- td.no{
- background-color: #fff;
- }
- table tr td {
- border:1px solid #ccc;
- text-align: center;
- padding: 10px;
- }
- table{
- border:2px solid #4d4d4d;
- }
- td.br{
- border-right: 2px solid #4d4d4d;
- }
- td.bb{
- border-bottom: 2px solid #4d4d4d;
- }
- td.brbb {
- border-bottom: 2px solid #4d4d4d;
- border-right:2px solid #4d4d4d;
- }
- </style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement