lunes, 22 de abril de 2013

Tabs tipo Chrome con CSS y jQuery


Excelente ejemplo para crear unos tabs con jquery y css, esto para dar el efecto como son los las pestañas en Google Chrome, les dejo el link para descargar el código fuente así como el articulo de como esta creado y como se implementa







Fuente: http://programacionalternativa.blogspot.mx/2013/04/tabs-tipo-chrome.html

Tomando fotos con la WebCam + HTML5

En los nuevos desarrollos web se estan incoporando nuevas formas de poder acceder al hardware de una computadora, y uno de estos dispositivos que ha llamado la atención es el uso de la webcam pero con HTML5, tratando de hacer uso de este dispositivo para diferentes propositos, como videoconferencias, tomar fotografias para el perfil de las redes sociales, llamadas, etc. Y eso se puede lograr con "pocas" lineas de código sin la necesidad de usar librerias externas.

Recuerden que hay que darle permiso a la página para que haga uso del hardware


Fuente: http://geeks.ms/blogs/etomas/archive/2013/04/19/html5-que-tus-usuarios-suban-su-foto-a-su-perfil-webrtc.aspx

lunes, 15 de abril de 2013

Pacman HTML5





Excelente juego de antaño desarrollado totalmente con HTML5, no se puede decir nada mas que, a disfrutar, les dejo el link con el código fuente para bajarlo.



viernes, 12 de abril de 2013

Canvas Game Bootstrap


Este es un juego que esta desarrollado con sprites, css, jquery, canvas, etc., el juego a mi parecer es bastante adictivo, y analizando el código no estan dificil, no quiere decir que sea facil, pero a veces uno cree que para hacer un juego nos va a llevar demasiado tiempo, el chiste esta en empezar a jugar con funciones que nos pueden permitir este tipo de animaciones, les dejo el demo y el link para que lo vean en acción y puedan ver el código fuente

Demo: http://jlongster.github.io/canvas-game-bootstrap/




jueves, 11 de abril de 2013

Street Fighter con CSS y Jquery




Vi una página donde estaba este ejemplo de como crear un pequeño juego de street fighter, todo esto hecho con css y jquery, me tome la libertad de tomar el ejemplo y comentar el codigo ya que creo que es importante saber que se esta haciendo para que esto funcione, de igual forma dejo el link para la página original, esto se vuelve muy interesante por si quisieramos agregar a un ryu por ejemplo y hacerlos pelear, yo agregue cierto codigo para que el ken no se salga del stage o que el hadoken no salga mas alla del stage, pero seria interesante hacer algun otro ejemplo donde se ponga otro personaje y los poderes peguen en el otro personaje y llevar un score!!!

Les dejo el codigo que use para implementarlo, este solamente lo guardan como un html y listo!!

jueves, 4 de abril de 2013

Imagen en un Canvas desde cero con HTML5

En este pequeño tutorial se explicará rápidamente como crear un canvas desde cero y asignarle una imagen para que se cargue en nuestra página HTML

En este caso yo utilice una imagen llamada robot.jpg, pero tu puedes usar la que desees y una vez implementado el siguiente código tendrás la imagen visible en la página, tambien les dejo la imagen que utilice






miércoles, 3 de abril de 2013

Iconos con CSS puro

Ya no es necesario tener iconos pequeños en formato .png o en .jpg, ahora esto se puede hacer por medio de css puro, son 84 diferentes opciones que tenemos con css para poder visualizar iconos en nuestras páginas, esto le da un estilo mas limpio a nuestros botones o links dentro de la página

Algunos ejemplos son los siguientes:



El código html y css lo pueden encontrar en el siguiente link