Encabezado Fijo ( con jquery )
Anteriormente había escrito un articulo sobre como mantener el encabezado fijo en el un tabla html con css; ahora he encontrado un plugin de jquery que permite hacerlo de forma mas facil:
1. Se descarga de: http://www.tablefixedheader.com/download/
2. Se vincula en la pagina donde esta la tabla que vas a fijar el encabezado: <script src="/js/jquery.fixheadertable.min.js" type="text/javascript"></script>
3. Se llama al plugin con los siguientes parametros:
$('#miTabla').fixheadertable({
caption : 'Titulo de la tabla',
colratio : [80, 90, 90, 90], // medidas del ancho de cada columna
resizeCol : true, // se puede cambiar el tamaño de la columna
minColWidth : 80 ,
height : 400,
showhide : true // esto es para ocultar o mostrar los datos con un clic
});
A petición de un lector:
y listo... encabezado fijo.
1. Se descarga de: http://www.tablefixedheader.com/download/
2. Se vincula en la pagina donde esta la tabla que vas a fijar el encabezado: <script src="/js/jquery.fixheadertable.min.js" type="text/javascript"></script>
3. Se llama al plugin con los siguientes parametros:
$('#miTabla').fixheadertable({
caption : 'Titulo de la tabla',
colratio : [80, 90, 90, 90], // medidas del ancho de cada columna
resizeCol : true, // se puede cambiar el tamaño de la columna
minColWidth : 80 ,
height : 400,
showhide : true // esto es para ocultar o mostrar los datos con un clic
});
A petición de un lector:
<table id="miTabla">
<thead>
<tr>
<th>Col 1</th>
<th>Col 2</th>
<th>Col 3</th>
</tr>
</thead>
<tbody>
<tr>
<td>XXX</td>
<td>YYY</td>
<td>ZZZ</td>
</tr>
<tr>
<td>AAA</td>
<td>BBB</td>
<td>CCC</td>
</tr>
</tbody>
</table>
y listo... encabezado fijo.
Podeis dar el ejemplo completo con el codigo html, por que no me funciona
ResponderEliminar