Created
July 27, 2010 21:16
-
-
Save lqc/492874 to your computer and use it in GitHub Desktop.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title></title> | |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
| <style type="text/css"> | |
| .click { | |
| background: white; | |
| opacity: 0.5; | |
| } | |
| #window { | |
| height: 300px; | |
| width: 200px; | |
| border: 1px solid black; | |
| display:none; | |
| } | |
| #header{ | |
| text-align: center; | |
| } | |
| </style> | |
| <script type="text/javascript" src="jquery.js"></script> | |
| <script type="text/javascript"> | |
| $(document).ready(function() { | |
| $("td").click(function(){ | |
| $(this).toggleClass("click"); | |
| $("#window").hide(); | |
| $("#window").show("fast"); | |
| $("#header").text(a); | |
| $("img").click(function(){ | |
| a.css("background", "black"); | |
| }); | |
| }); | |
| $("a").click(function(){ | |
| var ids = $('.click').map(function(){ | |
| return $(this).attr('id'); | |
| }).get(); | |
| alert(ids); | |
| }); | |
| }); | |
| </script> | |
| </head> | |
| <body> | |
| <table id="lol" style="background: url('a.gif)'"> | |
| <tr> | |
| <td id='1x1' style='width: 50px; height: 50px;'></td> | |
| <td id='2x1' style='width: 50px; height: 50px;'></td> | |
| <td id='3x1' style='width: 50px; height: 50px;'></td> | |
| <td id='4x1' style='width: 50px; height: 50px;'></td> | |
| <td id='5x1' style='width: 50px; height: 50px;'></td> | |
| <td id='6x1' style='width: 50px; height: 50px;'></td> | |
| <td id='7x1' style='width: 50px; height: 50px;'></td> | |
| <td id='8x1' style='width: 50px; height: 50px;'></td> | |
| </tr> | |
| <tr> | |
| <td id='1x2' style='width: 50px; height: 50px;'></td> | |
| <td id='2x2' style='width: 50px; height: 50px;'></td> | |
| <td id='3x2' style='width: 50px; height: 50px;'></td> | |
| <td id='4x2' style='width: 50px; height: 50px;'></td> | |
| <td id='5x2' style='width: 50px; height: 50px;'></td> | |
| <td id='6x2' style='width: 50px; height: 50px;'></td> | |
| <td id='7x2' style='width: 50px; height: 50px;'></td> | |
| <td id='8x2' style='width: 50px; height: 50px;'></td> | |
| </tr> | |
| <tr> | |
| <td id='1x3' style='width: 50px; height: 50px;'></td> | |
| <td id='2x3' style='width: 50px; height: 50px;'></td> | |
| <td id='3x3' style='width: 50px; height: 50px;'></td> | |
| <td id='4x3' style='width: 50px; height: 50px;'></td> | |
| <td id='5x3' style='width: 50px; height: 50px;'></td> | |
| <td id='6x3' style='width: 50px; height: 50px;'></td> | |
| <td id='7x3' style='width: 50px; height: 50px;'></td> | |
| <td id='8x3' style='width: 50px; height: 50px;'></td> | |
| </tr> | |
| <tr> | |
| <td id='1x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='2x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='3x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='4x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='5x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='6x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='7x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='8x4' style='width: 50px; height: 50px;'> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td id='1x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='2x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='3x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='4x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='5x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='6x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='7x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='8x5' style='width: 50px; height: 50px;'> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td id='1x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='2x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='3x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='4x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='5x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='6x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='7x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='8x6' style='width: 50px; height: 50px;'> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td id='1x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='2x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='3x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='4x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='5x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='6x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='7x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='8x7' style='width: 50px; height: 50px;'> | |
| </td> | |
| </tr> | |
| <tr> | |
| <td id='1x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='2x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='3x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='4x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='5x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='6x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='7x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| <td id='8x8' style='width: 50px; height: 50px;'> | |
| </td> | |
| </tr> | |
| </table> | |
| <a id="show_selected_button" href='#'>Wyświetl jakie elementy są zaznaczone</a> | |
| <div id="window"> | |
| <h1 id="header"> </h1> | |
| <img id="tree" src="tree.png">Wstaw obiekt w kratke | |
| </div> | |
| <div id="zaznaczyles"></div> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment