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

Frogx Three

Javascript

Javascript

Plugin para hacer tus formularios web más esteticos

formplate

Formplate es un plugin para hacer que los formularios de tu pagina web se vean más estéticos y con un diseño fuera del común y feo diseño que se muestra por default como parte del UI de cada navegador, este plugin es una combinación entre JavaScript y CSS3 que genera código HTML5 valido para cambiar el estilo de tus formularios y el diseño sea el mismo sea en navegadores web de computadoras de escritorio, móviles o tabletas, sin importar el navegador, la versión o el sistema operativo. El plugin es gratuito, utiliza un par de dependencias las cuales son Modernizr y jQuery para funcionar de forma adecuada e integrarse correctamente con cualquier navegador web, en su pagina web la cual enlazamos más abajo se muestra un ejemplo de como incluir este plugin en tu pagina web. Enlace para descargar Formplate...

Seguir leyendo 63

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 30

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 32

Atractivo diseño de formulario web full screen

formulario full screen

Navegando por los recursos que comparten en Codrops me encontré este excelente diseño de formulario web full screen, es un diseño que refleja muchas cosas muy buenas como elegancia, usabilidad, sencillez y todo combinado en un diseño moderno y fácil de navegar, considero el diseño puede ser perfecto para pequeñas encuestas por su sencillez en todos los aspectos desde el diseño de los campos del formulario hasta toda la interface que refiere a un sitio responsivo y aplicable a cualquier dispositivo. Les comparto los respectivos enlaces donde podrán descargar los scripts JavaScript y CSS, así como ver el tutorial para crear formularios web con este estilo en tu pagina web, así como también la pagina demo donde podrán probar esta interface web para formularios. Enlaces: Descargar Scripts & Tutorial | Demo...

Seguir leyendo 30

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

Modifica el diseño de los Selects usando CSS

selects personalizados

Los diseños de paginas web cada vez son mas personalizados, el uso de imágenes de gran tamaño, efectos visuales y de animación que ahora permite CSS3 sin necesidad de scripts extras, el uso de funciones asincronicas, ajax, canvas, webfonts, en fin una gran cantidad de cosas que hace 5 años nadie utilizaba y ahora son algo muy común en los diseños web. Pero uno de los diseños que ha tardado mas en cambiar es el diseño de los elementos del formulario, son muy pocos los diseñadores web que se atreven a utilizar diseños personalizados para los Selects, Checkbox y Radio Buttons en particular pues los navegadores no ofrecen opciones de personalización en su soporte, sin embargo con el uso de CSS y JavaScript todo es posible. El siguiente enlace incluye un breve manual y un paquete con scripts CSS y JavaScript que te permitirán personalizar los elementos Selects de tu......

Seguir leyendo 35

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 45

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 29

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 29

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 20

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

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

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 22

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 31

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

Pagina 1 de 5123...Antiguas »