Como hacer menus con css 3

CSS3Menu es una aplicación gratuita muy interesante que permite generar menús de navegación atractivos, sin imágenes y sin javascript. El menú generado aprovecha las propiedades border-radius y animation de CSS3, por lo que funciona perfectamente con las últimas versiones de Firefox, Opera y Safari. El menú también funciona en los navegadores no compatibles con CSS3 como IE7 pero algunas características como las esquinas redondeadas o las sombras se pierden.

Exportar tablas HTML a Excel con PHP y JQuery

En este post vamos a ver cómo utilizar jQuery para exportar los datos de una tabla a Excel. El tutorial es una adaptación de lo explicado en un post de TopSEMLTips. Lo primero que necesitamos es importar jQuery:

<script src="jquery-1.3.2.min.js" type="text/javascript"></script>

Lo siguiente es tener una tabla en HTML que deseamos exportar a Excel. Puesto que luego lo utilizaremos, necesitamos asignarle un identificador a la tabla, por ejemplo id=”Exportar_a_Excel”.

<table id="Exportar_a_Excel">
<tbody>
<tr>
<td>Celda1</td>
<td>Celda2</td>
<td>Celda3</td>
<td>Celda4</td>
<td>Celda5</td>
</tr>
<tr>
<td>Celda6</td>
<td>Celda7</td>
<td>Celda8</td>
<td>Celda9</td>
<td>Celda10</td>
</tr>
</tbody>
</table>

Lo siguiente es crear un formulario, también con un identificador para almacenar el contenido de la tabla en un campo oculto y posteriormente enviarlo al php que generará la hoja de cálculo.

<form id="FormularioExportacion" action="ficheroExcel.php"

method="post">Exportar a Excel

<img class="botonExcel" src="export_to_excel.gif" alt="" />

<input id="datos_a_enviar" name="datos_a_enviar" type="hidden" />

</form>

Ahora necesitaremos volcar toda la tabla en el campo oculto y enviar el formulario. Para ello nos servimos de jQuery:

<script type="text/javascript">//
<![CDATA[$(document).ready(function() {
     $(".botonExcel").click(function(event) {
     $("#datos_a_enviar").val( $("
<div>").append( $("#Exportar_a_Excel").eq(0).clone()).html());
     $("#FormularioExportacion").submit();
});
});
// ]]>

El fichero php recogerá el contenido del campo oculto “datos_a_enviar” y lo mostrará con el content-type apropiado. Así pues, ficheroExcel.php sería:

<!--?php
header("Content-type: application/vnd.ms-excel; name='excel'");
header("Content-Disposition: filename=ficheroExcel.xls");

header("Pragma: no-cache");
header("Expires: 0");
echo $_POST['datos_a_enviar'];
?-->

Descargar ejemplo

jQuery Webcam

jQuery Webcam es un plugin que crea una capa transparente para comunicarse con una cámara, directamente en JavaScript. Se aprovecha de un archivo SWF (que viene incluido en los archivos fuente) y puede mostrar la salida de la webcam y realizar capturas de imágenes. El plugin es capaz de mostrar la lista de cámaras disponibles y seleccionar cualquiera de ellas. En la página del plugin podemos acceder a una demostración del mismo.

jQuery Webcam