Hay 7 articulo(s) nuevo(s) en portada, haz click aquí para leer.

Frogx Three

Javascript

App JavaScript para crear lineas de tiempo con HTML5 y CSS3

timesheet js

Time Sheet JS es una interesante App JavaScript que te facilita crear lineas de tiempo aprovechando la flexibilidad de HTML5 y CSS3, es un script muy fácil de utilizar e integrar en tu pagina web, basta con incluir el script y definir un arreglo en formato JSON con los datos que deseas se desplieguen como parte de la linea de tiempo, definiendo para cada dato una fecha inicial y una fecha inicial así como la información referente a dicho evento. La forma en la que nos permite crear las lineas de tiempo nos permite crear el arreglo de datos y eventos de manera muy sencilla integrando los datos desde una base de datos usando AJAX por ejemplo, no hay mucha documentación sobre la herramienta, solo una pequeña guía que explica como crear tu primera linea de tiempo con Time Sheet, les dejo el ejemplo. Por cierto resaltar que esta librería no......

Seguir leyendo 24

Plugin jQuery para crear diseños web inspirados en Windows 8

grid windows 8 metro

Gridster es un excelente y muy útil plugin jQuery perfecto para diseñadores web que busquen crear diseños de paginas web modernos y fuera de lo común, este plugin hecho con jQuery te facilita la construcción de diseño web inspirados en el sistema de girds o rejillas que utiliza el tema Metro que viene por default en Windows 8, Metro presento un estilo de organización de contenidos y accesos por medio de bloques ordenados de forma aleatoria en diferentes dimensiones encajando perfectamente entre ellos. Gridster también permite agregar eventos drag & drop a estos bloques con la intensión de reordenarlos al arrastrar y provocando un efecto de acomodo automatico entre los bloques, este plugin es completamente gratuito y muy fácil de utilizar en la pagina web oficial podrán descargarlo y ver una serie de ejemplo de uso de Gridster. Enlace para descargar Gridster...

Seguir leyendo 26

Tutorial para crear notificaciones animadas con CSS3

notificaciones css

Fantástico tutorial y códigos CSS3 para crear increíbles diseños de notificaciones con animación para tus diseños de paginas web, en el ejemplo que enlazamos al final verán 12 ejemplos de notificaciones web animadas con muy buen diseño y fáciles de aplicar en tu pagina, algunas utilizan librerías JavaScript para las animaciones y las acciones pero en general se trata de código CSS para generar las animaciones utilizando transiciones y los keyframes, características incluidas en CSS3 y que ya son soportadas por la gran mayoría de los navegadores web modernos. En el segundo enlace encontrarán el enlace para descargar la guiá de instalación y un paquete con los códigos CSS3 y scripts JavaScript para utilizar todos estos diseños de notificaciones animadas para mejorar el diseño de interface de tus paginas web. Enlaces: Demo | Descargar códigos y tutorial...

Seguir leyendo 24

Skippr, sencillo, muy sencillo plugin jQuery para crear slideshows responsivos

Skippr

Skippr es un excelente plugin jQuery para crear slideshows de una forma muy sencilla, el plugin es bastante liviano, simple y promete no cargar de recursos de tu sitio web, solo necesita de un pequeño archivo JS sin archivos CSS, solo unas 10 lines de CSS y listo, otra característica que por su estructura le permite funcionar de esa forma es que es un plugin jQuery slideshow 100% responsivo es decir que se adapta automáticamente a cualquier resolución y dispositivo, y por su puesto lo mejor, es gratuito. Enlace para descargar Skippr Skippr...

Seguir leyendo 36

Famo.us, Framework Javascript para crear diseños de interface atractivos

famous

Famo.us es un excelente framework Javascript especial para crear diseños de interface modernos y muy atractivos, el framework es muy fácil de utilizar e implementar, por supuesto es gratis. En el sitio oficial de Famo.us encontrarán gran cantidad de recursos entre documentación de todas las funciones, ejemplos de diseños de interface hechos con el framework y otros snippets que te facilitaran el trabajo. Enlace para descargar Famo.us...

Seguir leyendo 20

Framer App y librería JS para hacer animaciones web

framerjs

Framer es una App que te permite exportar Assets de archivos PSD y también de diseños hechos en Sketch, guardando por separado las imágenes en formato PNG y generando los archivo HTML, CSS y JS necesarios, para iniciar un proyecto utilizando FramerJS una librería para hacer animaciones web muy sencilla de utilizar y de rápida implementación, los ejemplos que podemos ver en el sitio nos muestran como crear animaciones secuenciales utilizando JavaScript para aplicar las propiedades CSS sin gran dificultad, estoy seguro que cualquier diseñador web con conocimientos básicos de HTML y JavaScript podrá utilizar esta librería y acostumbrar rápidamente. Considero que Framer es una excelente herramienta para diseñadores web sea la aplicación o simplemente la librería JavaScript pueden ser de gran utilidad los diseñadores que deseen aplicar animación a los elementos de sus diseños web. Enlace: Framer...

Seguir leyendo 19

Plugin jQuery para crear galerías web atractivas

plugin jquery

Fotorama es un excelente plugin jQuery para crear galerías web con estilo, es un plugin bastante completo que incluye versión para WordPress, Fotorama es gratis y puede ser personalizado según tus necesidades, en el sitio pueden encontrar toda clase ejemplos para crear galerías de imágenes, galerías de videos, animaciones flash, capas HTML, etc… Fotorama fue diseñado y desarrollador por el diseñador web Artem Polikarpov de Rusia, en fin les recomiendo este excelente plugin para crear paginas web con galerías de fotos atractivas. Enlace para descargar Fotorama...

Seguir leyendo 20

UIKit un interesante Framework para diseñar paginas web

UIKIT

UIKit es una excelente framework para diseñar paginas web, es un alternativa mas que recomendable al famoso Bootstrap, UIKit es un framwork OpenSource que incluye una gran cantidad de componentes para personalizar y armar de una forma rápida nuestra pagina web, incluye archivos CSS base para normalizar el estilo de los elementos, CSS para impresión, plantilla grid basada en el estándar 960 que nos ayudara a crear paginas web responsivas. Es muy fácil de integrar, básicamente tienen que insertar los archivos CSS y según los componentes o addons que deseen agregar algunos archivos JavaScript, les dejo el enlace a la pagina oficial del proyecto donde podrán descargar UIKit gratis y leer toda su documentación. Enlace para descargar UIKit Framework...

Seguir leyendo 32

HybridAuth plugins JS para conectar con redes sociales

boton login facebook

HybridAuth es un excelente plugin JS para conectar con redes sociales a los usuarios de tu sitio, con este plugin tienes todo lo necesario para crear sistemas de registros y acceso para usuarios utilizando las cuentas de sus redes sociales, es muy fácil de implementar, HybridAuth te permite realizar conexiones con Facebook, Twitter, Google+, Instagram, LinkedIn, Foursquare, entre otras redes sociales. El plugin es muy completo y excelente para los programadores web ya que les permitirá ahorrar mucho tiempo en el desarrollo de sus aplicaciones web que necesiten conexión con redes sociales. HybridAuth les ahorrara el trabajo de implementar las API’s que ofrece cada red social para realizar conexiones y también para recibir la información de los perfiles de los usuarios que haga login en tu aplicación utilizando sus cuentas de Facebook, Twitter, etc. Para complementar este recurso les comparto una serie de paquetes de botones e iconos de redes sociales para......

Seguir leyendo 28

Backbone JS framework utilizado por Rdio, Foursquare, WordPress y otros

Backbone js

Backbone JS es el framework JavaScript definitivo para los desarrolladores web que busquen desarrollar aplicaciones web robustas utilizando como base JavaScript, Backbone JS ofrece una enfoque de programación en base a modelos y un mejorado uso de los eventos, ofrece una gran cantidad de funciones que hacen de su API una de las mas robustas para el desarrollo web. Este framework no es uno mas del montón, es utilizado por redes sociales, paginas web importantes y famosas aplicaciones web como Rdio, Foursquare y WordPress.com, en el siguiente enlace pueden ver la lista de proyectos que utilizan este Framework. Backbone JS se integra fácilmente con otros frameworks como jQuery, es una aplicación bastante ligera que no hará mas lenta tu aplicación, optimiza el manejo de datos JSON, trabaja con atributos adicionales en las etiquetas HTML (data-, ng-), en conclusión es una herramienta que todo programador web con experiencia debería tomar en......

Seguir leyendo 14

11 Plugins JS para hacer diseños web responsivos

diseños web responsivos

Les compartimos una serie de excelentes plugins javascript perfectos para hacer diseños web responsivos, esto será de gran utilidad para seguir una de las tendencias de diseño web en 2014 que se trata de crear diseños web adaptables a cualquier plataforma sin importar navegador y mostrando contenido de calidad aprovechando las posibilidades que los diferentes dispositivos ofrecen tanto en imágenes de alta resolución como en interactividad. Plugins JS para hacer diseños web responsivos Adapt.Js Es un alternativa al uso y dependencia de los Media Queries con CSS, que si bien cierto son excelentes aun no son reconocidos por todos los navegadores, lo cual puede causarnos algunos problemas, con Adapt.js eliminamos esa dependencia, también ofrece soporte para la mayoría de los navegadores incluso Internet Explorer, con este plugin podremos identificar el tamaño de la venta o resolución de pantalla de la persona que accede a nuestro sitio de tal modo que sirvamos......

Seguir leyendo 138

jQuery Selectric: script para cambiar diseño de selects en formularios

jQuery Selectric

jQuery Selectric es un excelente script jQuery que permite cambiar diseño de selects o listas de tus formularios HMTL con la combinación de CSS3 y JavaScript, el script es muy fácil de implementar y también de personalizar con hojas de estilo, este script ofrece soporte para diferentes navegadores entre ellos: Firefox Chrome Safari Internet Explorer 7+ Opera En la pagina de demostración de este script podemos ver algunas opciones que nos ofrece jQuery Selectric, como agregar opciones a la lista de forma dinámica, permite ejecutar Callbacks dependiendo del valor de la opción seleccionada, y también ejecutar acciones Ajax para comunicarnos con el servidor y manejar respuestas de forma dinámica, todo esto gracias a jQuery. Enlace para descargar: jQuery Selectric...

Seguir leyendo 18

Foundation 5 una poderosa alternativa a Bootstrap

foundation

Foundation es un poderoso framework para diseño web, no es nuevo de hecho recientemente lanzaron Foundation 5 el cual se posiciona como una poderosa alternativa a Bootstrap, este framework que hará del diseño web una tarea mas sencilla se integra fácilmente con jQuery y tiene una gran cantidad de características, muchas de ellas centradas en la creación de diseños web responsivos. Algunas de sus características son: Integra Fastclick.js librería que elimina ese pequeño delay al hacer click en smartphones y tabletas Animaciones con CSS mas fluidas Off Canvas Creación más sencilla de formularios, con validaciones y patrones para campos Integración con Sublime Text Plantillas para iniciar proyectos Librería para trabajar con SASS Libsassy Una muy buena alternativa que los diseñadores web deberíamos considerar muy seriamente antes de iniciar un proyecto web. Descargar: Foundation 5...

Seguir leyendo 29

La solución a menus drop down extensos

menus drop down

Seguro quienes dedican su tiempo al diseño web se han topado con un problema cuando necesitamos crear menus drop down pero estos necesitan tener infinidad de opciones y aparte nos prohiben modificar el diseño y estructura del menu, bueno con este mismo problema se topo el diseñador web Larry Geams quien ha ideado una forma sencilla y útil para dar solución a los menus de navegación drop down demasiado largos. Para ello utilizo algunas opciones básicas de CSS y también aplico un podo de JavaScript apoyado en jQuery para poder dotar de funciones y características necesarias con el fin de que el menu de navegación no se deforme y ofrezca una navegación amigable, Larry ha publicado el código de su propuesta en el sitio Codepen.io de donde pueden copiar el código HTML, CSS y JS utilizado para crear este menu. Enlace: Codepen.io...

Seguir leyendo 35

Script para detectar dispositivos con JavaScript

device type

Device JS es un script imprescindible para diseñadores web que busquen crear diseños web responsivos, Device JS es un script capaz de detectar dispositivos con JavaScript de forma sencilla sin utilizar otro tipo de lenguajes, Device JS es capaz de detectar el tipo de dispositivo del visitante entre Mobile, Tableta y equipo de escritorio, la orientación del dispositivo entre tipo portrait y tipo landscape y también permite detectar el sistema operativo del dispositivo de tal modo que podamos utilizar una serie de clases CSS para adaptar nuestro diseño web de acuerdo al dispositivo del usuario que esta visitando el sitio. Un ejemplo practico para utilizar esta librería sería ocultar ciertos elementos o cambiar su disposición en la pantalla combinando esta librería con CSS, por ejemplo en un diseño web de dos columnas podríamos ocultar una columna cuando el script detecte una orientación tipo portrait y mostrarla cuando sea tipo landscape. Device......

Seguir leyendo 20

Librería JavaScript para crear imágenes SVG fácil

svg

Snap SVG es un poderosa librería JavaScript para crear imágenes SVG de una manera sencilla y bastante intuitiva, te permite crear cualquier tipo de formas e incluso animaciones aprovechando la potencia que nos brinda SVG (Scalable Vector Graphics) en los motores gráficos de los navegadores Web, con esta librería es sumamente sencillo crear imágenes SVG, como la que podemos ver a continuación, en esta en particular podemos apreciar básicamente un mapa isometrico el cual fue realizado con Snap SVG esta imagen por cierto la pueden ver animada haciendo click sobre ella. Snap SVG es una librería gratuita bajo licencia Open Source, esta librería es capaz de leer gráficos SVG generados por aplicaciones como Adobe Illustrator, Inkscape, o Sketch. Video Librería JavaScript para crear imágenes SVG Enlace: Snap SVG...

Seguir leyendo 34

Dropzone para subir archivos usando Drag ‘n’ Drop

dropzone

Les dejamos una excelente librería que recién encontramos se trata de Dropzone para subir archivos utilizando acciones Drag ‘n’ Drop, esta librería bastante sencilla ofrece la posibilidad de incluir en nuestra interface un areá para subir imágenes, con la simple acción de arrastrar la imagen de nuestras carpetas a la sección que habilitemos en nuestro formulario y soltando, con esto automáticamente se empezara a subir la imagen al servidor incluso creando un preview de la imagen que hemos subido. Una librería JavaScript bastante potente y sencilla de aplicar, no requiere de jQuery como lo hacen muchas librerías que se han lanzado últimamente, y ofrece soporte para los siguientes navegadores: Chrome 7+ Firefox 4+ IE 10+ Opera 12+ (Version 12 for MacOS is disabled because their API is buggy) Safari 6+ Enlace: Dropzone...

Seguir leyendo 21

RevealJS: Crear presentaciones HTML5 con efectos 3D

reveals

RevealJS es una librería JavaScript que te permite crear presentaciones HTML5 con efectos 3D de una manera sencilla y elegante, RevealJS aprovecha las bondades que la combinación entre JavaScript y CSS3 pueden ofrecer para crear estos efectos, para quienes no tengan las habilidades de programación también pueden utilizar Slid.es una aplicación web que utiliza RevealJS la cual ofrece un editor visual para crear presentaciones con efectos utilizando HTML5 y CSS3, la aplicación ofrece un paquete gratuito y un paquete de $7 dólares mensuales. Independientemente de eso creanme que implementar RevealJS para crear tus presentaciones con HTML5 no es muy complicado. Enlace: RevealJS | Slid.es...

Seguir leyendo 24

Slideme, slideshow jQuery de paginas completas

jquery slider

Slideme es otro plugin que permite aplicar a nuestros diseños web un slideshow jQuery de paginas completas, perfecto para hacer diseños web diferentes con métodos de navegación distintos como ahora podemos ver en los nuevos diseños de productos y juegos que aprovechan las características que HTML5, CSS3 y frameworks como jQuery nos brindan. Slideme es una alternativa a Full Page del cual hablamos hace unos días, el cual nos permitía hacer un slide o scroll de pantalla completa, personalmente considero que Slideme es un plugin mas completo y personalizable, porque nos permite hacer scroll tanto horizontal como vertical. Enlace: SlideMe...

Seguir leyendo 34

Plugin jQuery para crear diseños web de pantalla completa con scroll

fullpage javescript

FullPage es un plugin jQuery gratis que te permitirá crear diseños web de pantalla completa con scroll, este tipo de diseños se ha vuelto muy popular y consiste en crear paginas web que aprovechen 100% del ancho y alto de la ventana del navegador para mostrar una sección del sitio y convierte el scroll en no mas que una herramienta para navegar entre secciones donde cada sección de la pagina ocupa el 100% de la ventana, este plugin jQuery es perfecto para crear landing page para productos o sitios con pocas secciones. Enlace: Full Page...

Seguir leyendo 38

Pagina 1 de 7123...6...Antiguas »