Striping de cebra a una columna de una tabla

Question

Tengo una mesa que usa los tibsorter y las rayas de cebra para las filas de mesa.Me gustaría agregar rayas de cebra a una de las columnas de la mesa para darle un poco de énfasis.Me gusta esto:

Answer 1

Si conoce el índice de columna de la que le gustaría rayar, puede hacerlo solo en CSS, usando: Selectores de nth de tipo así:

tr:nth-of-type(even) td:nth-of-type(3) { background: rgba(0,0,0,0.1); }

(donde se está utilizando 3 un marcador de posición para su índice de columna de destino)

Otra opción sería poner una clase en el encabezado (o primero TD) de la columna que desea rayar, y luego use JS para frenar los otros TDS en la misma columna:

var col_to_stripe = $('th.stripe-this-one').index();

$('table.selectively-stripe').find('tr:odd')
  .each(function() {
    $(this).children('td')
      .eq(col_to_stripe)
      .css('background', 'pink');
  });

La clase no es necesaria, ya que, obviamente, puede simplemente colocar el índice de columnas que desea como con el enfoque CSS puro, pero es mejor para la claridad del código.

Demo aquí: http://jsbin.com/axutal/2/edit

Answer 2

Verifique esto enlace

Esto se puede hacer usando jQuery sin dar nombres de clase o ID.

 $('tr:odd  td:nth-child(4)').css('background','#999999'); /* For odd td's */
 $('tr:even td:nth-child(4)').css('background','#DDDDDD'); /* For even td's */  

Para obtener más información sobre este jQuery selector Vaya a través de este enlace

Answer 3

Necesitará un nombre de clase adicional y la declaración CSS correspondiente para los TDS en esa columna.