Tag: kolorowanie rekordów

20 mar 2009

Kolorowanie rekordów

<script>
  $(function () {
    $('.zebra tr:even').addClass('even');
    $('.zebra tr:odd').addClass('odd');
  });
</script>
 
<style>
  .zebra tr.even td,
  .zebra tr.even th {
    background-color: #FFF;
  }
  .zebra tr.odd td {
    background-color: #A9C0E0;
  }
</style>

<table class='zebra'>
  <thead>
    <tr>
      <th>pierwsza</th>
      <th>druga</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>2009-03-20
      <td>
      <td>1
      <td>
    </tr>
    <tr>
      <td>2009-03-20
      <td>
      <td>2
      <td>
    </tr>
    <tr>
      <td>2009-03-20
      <td>
      <td>3
      <td>
    </tr>
  <tbody>
</table>
17 lut 2009

Kolorowanie rekordów w tabeli

Przypisanie zdarzeń do tagów

tabeli

<script>
  function add_tr_hover(id) {
    alert(id);
    var elem = document.getElementById(id);
    var lista = elem.getElementsByTagName('tr');
    for (var i = 0; i < lista.length; i++) {
      lista[i].onmouseover = function () { this.style.backgroundColor = '#EDEDED'; }
      lista[i].onmouseout = function () { this.style.backgroundColor = '#FFFFFF'; }
    }
  }
  window.onload = function () {
    add_tr_hover("cos");
  }
</script>

Przykładowy HTML tabeli

<table id="cos">
  <tr>
    <TD>jeden</TD>
  </tr>
  <tr>
    <TD>dwa</TD>
  </tr>
  <tr>
    <TD>trzy</TD>
  </tr>
  <tr>
    <TD>cztery</TD>
  </tr>
  <tr>
    <TD>pięć</TD>
  </tr>
</table>
Copyright © | kodyWiG Theme