API tools faq
paste
Guest User

Sciter

a guest
Oct 29th, 2016
110
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5.42 KB | None | 0 0
raw download clone embed print report
  1. <head>
  2. <style>
  3. html {
  4.  overflow: hidden;
  5.  background-color: #e0e0ff;
  6. }
  7.  
  8. form#schedule-parent {
  9.  width: *;
  10.  height: 50%;
  11.  overflow-x: auto;
  12.  overflow-y: auto;
  13.  background-color: #fff;
  14. }
  15.  
  16. .schedule {
  17.  border-collapse: collapse;
  18.  border-spacing: 0;
  19.  border-color: #ccc;
  20.  height: *;
  21. }
  22. .schedule > thead {
  23.  display: block;
  24. }
  25. .schedule > tbody {
  26.  display: block;
  27.  overflow: auto;
  28. }
  29. .schedule > tbody > tr > td {
  30.  padding: 10px 5px;
  31.  border-style: solid;
  32.  border-width: 1px;
  33.  border-color: #ccc;
  34.  color: #333;
  35.  background-color: #66C166;
  36.  cursor: pointer;
  37.  behavior: check;
  38.  height:*;
  39. }
  40. .schedule:disabled > tbody > tr > td {
  41.  background-color: #efefef;
  42. }
  43. .schedule > tbody > tr > td:first-child {
  44.  cursor: default;
  45.  behavior: none;
  46.  background-color: #fff;
  47. }
  48. .schedule > tbody > tr > td:checked {
  49.  background-color: #FF4C4C;
  50. }
  51. .schedule:disabled > tbody > tr > td:checked {
  52.  background-color: #dfdfdf;
  53. }
  54. .schedule > thead > tr > th {
  55.  padding: 10px 5px;
  56.  border-style: solid;
  57.  border-width: 1px;
  58.  border-color: #ccc;
  59.  color: #333;
  60.  background-color: #f0f0f0;
  61.  white-space: nowrap;
  62.  font-size: 8px;
  63.  font-weight: normal;
  64. }
  65. </style>
  66. <script type="text/tiscript">
  67. $(form#schedule-parent).on("click", "td", function() {
  68.  if (this.checked) {
  69.   $(p#1).value = "Checked: Collumn: " + this.index + " Row: " + this.parent.index;
  70.  } else {
  71.   $(p#1).value = "Un-Checked: Collumn: " + this.index + " Row: " + this.parent.index;
  72.  }
  73. });
  74. $(button#disabled).subscribe("click", function() {
  75.  $(table).state.disabled = $(button).checked;
  76. });
  77. $(button#reset).subscribe("click", function() {
  78.  var tds = $$(.schedule > tbody > tr > td);
  79.  for( var (index,val) in $$(.schedule > tbody > tr > td) )
  80.   tds[index].checked = false;
  81. });
  82. </script>
  83. </head>
  84. <body>
  85.  
  86. <form #schedule-parent>
  87.  <table class="schedule">
  88.   <thead>
  89.   <tr>
  90.     <th></th>
  91.     <th>0.00 - 0.59</th>
  92.     <th>1.00 - 1.59</th>
  93.     <th>2.00 - 2.59</th>
  94.     <th>3.00 - 3.59</th>
  95.     <th>4.00 - 4.59</th>
  96.     <th>5.00 - 5.59</th>
  97.     <th>6.00 - 6.59</th>
  98.     <th>7.00 - 7.59</th>
  99.     <th>8.00 - 8.59</th>
  100.     <th>9.00 - 9.59</th>
  101.     <th>10.00 - 10.59</th>
  102.     <th>11.00 - 11.59</th>
  103.     <th>12.00 - 12.59</th>
  104.     <th>13.00 - 13.59</th>
  105.     <th>14.00 - 14.59</th>
  106.     <th>15.00 - 15.59</th>
  107.     <th>16.00 - 16.59</th>
  108.     <th>17.00 - 17.59</th>
  109.     <th>18.00 - 18.59</th>
  110.     <th>19.00 - 19.59</th>
  111.     <th>20.00 - 20.59</th>
  112.     <th>21.00 - 21.59</th>
  113.     <th>22.00 - 22.59</th>
  114.     <th>23.00 - 23.59</th>
  115.   </tr>
  116.   </thead>
  117.   <tbody>
  118.   <tr>
  119.     <td >Monday</td>
  120.     <td></td>
  121.     <td></td>
  122.     <td></td>
  123.     <td></td>
  124.     <td></td>
  125.     <td></td>
  126.     <td></td>
  127.     <td></td>
  128.     <td></td>
  129.     <td></td>
  130.     <td></td>
  131.     <td></td>
  132.     <td></td>
  133.     <td></td>
  134.     <td></td>
  135.     <td></td>
  136.     <td></td>
  137.     <td></td>
  138.     <td></td>
  139.     <td></td>
  140.     <td></td>
  141.     <td></td>
  142.     <td></td>
  143.     <td></td>
  144.   </tr>
  145.   <tr>
  146.     <td>Tuesday</td>
  147.     <td></td>
  148.     <td></td>
  149.     <td></td>
  150.     <td></td>
  151.     <td></td>
  152.     <td></td>
  153.     <td></td>
  154.     <td></td>
  155.     <td></td>
  156.     <td></td>
  157.     <td></td>
  158.     <td></td>
  159.     <td></td>
  160.     <td></td>
  161.     <td></td>
  162.     <td></td>
  163.     <td></td>
  164.     <td></td>
  165.     <td></td>
  166.     <td></td>
  167.     <td></td>
  168.     <td></td>
  169.     <td></td>
  170.     <td></td>
  171.   </tr>
  172.   <tr>
  173.     <td>Wednesday</td>
  174.     <td></td>
  175.     <td></td>
  176.     <td></td>
  177.     <td></td>
  178.     <td></td>
  179.     <td></td>
  180.     <td></td>
  181.     <td></td>
  182.     <td></td>
  183.     <td></td>
  184.     <td></td>
  185.     <td></td>
  186.     <td></td>
  187.     <td></td>
  188.     <td></td>
  189.     <td></td>
  190.     <td></td>
  191.     <td></td>
  192.     <td></td>
  193.     <td></td>
  194.     <td></td>
  195.     <td></td>
  196.     <td></td>
  197.     <td></td>
  198.   </tr>
  199.   <tr>
  200.     <td>Thursday</td>
  201.     <td></td>
  202.     <td></td>
  203.     <td></td>
  204.     <td></td>
  205.     <td></td>
  206.     <td></td>
  207.     <td></td>
  208.     <td></td>
  209.     <td></td>
  210.     <td></td>
  211.     <td></td>
  212.     <td></td>
  213.     <td></td>
  214.     <td></td>
  215.     <td></td>
  216.     <td></td>
  217.     <td></td>
  218.     <td></td>
  219.     <td></td>
  220.     <td></td>
  221.     <td></td>
  222.     <td></td>
  223.     <td></td>
  224.     <td></td>
  225.   </tr>
  226.   <tr>
  227.     <td>Friday</td>
  228.     <td></td>
  229.     <td></td>
  230.     <td></td>
  231.     <td></td>
  232.     <td></td>
  233.     <td></td>
  234.     <td></td>
  235.     <td></td>
  236.     <td></td>
  237.     <td></td>
  238.     <td></td>
  239.     <td></td>
  240.     <td></td>
  241.     <td></td>
  242.     <td></td>
  243.     <td></td>
  244.     <td></td>
  245.     <td></td>
  246.     <td></td>
  247.     <td></td>
  248.     <td></td>
  249.     <td></td>
  250.     <td></td>
  251.     <td></td>
  252.   </tr>
  253.   <tr>
  254.     <td>Saturday</td>
  255.     <td></td>
  256.     <td></td>
  257.     <td></td>
  258.     <td></td>
  259.     <td></td>
  260.     <td></td>
  261.     <td></td>
  262.     <td></td>
  263.     <td></td>
  264.     <td></td>
  265.     <td></td>
  266.     <td></td>
  267.     <td></td>
  268.     <td></td>
  269.     <td></td>
  270.     <td></td>
  271.     <td></td>
  272.     <td></td>
  273.     <td></td>
  274.     <td></td>
  275.     <td></td>
  276.     <td></td>
  277.     <td></td>
  278.     <td></td>
  279.   </tr>
  280.   <tr>
  281.     <td>Sunday</td>
  282.     <td></td>
  283.     <td></td>
  284.     <td></td>
  285.     <td></td>
  286.     <td></td>
  287.     <td></td>
  288.     <td></td>
  289.     <td></td>
  290.     <td></td>
  291.     <td></td>
  292.     <td></td>
  293.     <td></td>
  294.     <td></td>
  295.     <td></td>
  296.     <td></td>
  297.     <td></td>
  298.     <td></td>
  299.     <td></td>
  300.     <td></td>
  301.     <td></td>
  302.     <td></td>
  303.     <td></td>
  304.     <td></td>
  305.     <td></td>
  306.   </tr>
  307.   </tbody>
  308.  </table>
  309. </form>
  310. <hr>
  311. <button|checkbox(checkboxButton) #disabled>Disable</button>
  312. <button #reset>Reset</button>
  313. <p #1></p>
  314. <p #2></p>
  315. </body>
  316. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!