Slide Note es un sencillo plugin desarrollado en jQuery que te permitirá mostrar una nota en tu página web con efecto de slide, bastante visual para mostrar un mensaje de bienvenida o la información que desees. Además Slide Note puede mostrar el contenido de una URL y opcionalmente puede mostrar también algún elemento incrustado en una página Html. Una vez instalado este plugin, su funcionamiento es sencillo, una vez abras tu página y al hacer scroll aprecerá tu nota con un efecto de slide desde el lateral del mismo, además tiene un botón de cierre al estilo de aplicaciones Mac. Puedes ver una Demo a través de slidenote.info, realiza scroll con tu ratón y la nota aparecerá. Como opciones de configuración podrás cambiar el botón de cierre de la Nota y la esquina desde donde aparecerá la misma. Podrás utilizar este plugin en cualquier plataforma, WordPress, Joomla, Drupal, eso sí sabiendo algo de código, pero ...

Seguramente ya has visto algún ejemplo de acordeon en jQuery, es un menu bastante original y elegante, además le da mucho dinamismo a una página web. Easy Accordion es un plugin con el que podrás implementar rapidamente un menu dinámico en jQuery. Easy Accordion generará el manu a través de listas definidas, además es compatible con SEO. Podrás también añadir multiples instancias que podrás colocar en la misma página, es decir varios menus distintos con este plugin. Se trata de un plugin muy completo en el que puedes utilizar imágenes, listas, Flash… y quedará totalmente personalizado con CSS. Además podrás configurarlo con varias opciones como auto-display, initial load, podrás incluir un número predeterminado de imágenes para el slide… Pruebalo y comentanos! Desde el enlace al plugin tienes documentación disponible para implementarlo de forma rápida y sencilla en tu página web. Easy Accordion Demo. Easy Accordion está disponible en ...

Tile5 es un proyecto open source (código abierto) que te permitirá mostrar mapas con HTML5 a través de una librería en Javascript. Una vez integrado tus usuarios podrán disfrutar de una experiencia más completa mediante HTML5. Además Tile5 es compatible con la mayoría de proveedores como Bing, Google, Yahoo, MapQuest… Detrás de la API utilizada para generar los mapas la librería Javascript te permitirá también crear otro tipo de interfaces. Además HTML5 provee de compatibilidad con plataformas móviles y navegadores de escritorio por lo que aseguras la visualización de la aplicación en cualquier de ellos. Puedes ver distintas demos de implementada a través de la página del proyecto. Además puedes acceder a la documentación de la API bien detallada, así como unos tutoriales para implementar Tile5. Página proyecto ...

Hoy os traemos un estupendo plugin jQuery con el que podrás mostrar la webcam con un marco en tu página web. Está desarrollado en jQuery y utiliza Flash de Adobe para permitir el acceso a la cámara web. Además dispone de otras características como captura de imágenes utilizando la webcam. Este plugin puede mostrar una lista de webcams disponibles y seleccionar una de ellas. El Streaming de video se puede realizar en cualquier tamaño, sin embargo requiere recompilar el código de SWF para ello. Se describe en la documentación del plugin. Puedes ver una Demo de este fantástico plugin y si necesitas implementarlo dispones de un manual bien ...

Ya os hemos enseñado varios ejemplos de Carruseles de imágenes desarrollados con jQuery en DiarioTHC. Muestran varias imágenes de productos o imágenes en forma destacada en un sitio web, de forma que se puede promocionar mucho mejor. En este caso os queremos mostrar carouFredSel, un nuevo plugin por el que conseguirás una cadena infinita de imágenes en el mismo, nunca se dejarán de mostrar imágenes en vuestra zona destacada, queréis saber como?.. os lo mostramos después del salto. carouFredSel es un plugin que utiliza una función por la que toma un número limitado de imágenes y una vez que se hayan mostrado seguirá mostrando imágenes en forma aleatoria con el set de imágenes de que dispone. Este plugin trabaja con varios objetos en diferentes alturas y anchuras y es compatible con cualquier plugin lightbox en jQuery. Es posible añadir o eliminar objetos del carrusel dinámicamente y dispone de controles para manejar el desplazamiento, ...

Si utilizas Twitter a menudo quizás te interese realizar copias de seguridad de tus tweets o bien archivarlos de forma que puedas encontrar algún enlace interesante y que a través de la interfaz web se te hace imposible, ya que Twitter por defecto no guarda tweets con más de 2 semanas de antiguedad. Para ello dispones de Tweet Nest una aplicación Open Source que te permitirá archivar todos tus tweets y a través de su interfaz web podrás explorar todo tu contenido. Además se archiva por meses y también por tipo de tweet (tweet, retweet, replicas…) Para utilizar Tweet Nest necesitarás tener instalado un servidor PHP + MySql para implementarla y luego poder configurarla. Puedes utilizarlo y comentarnos que te parece. Si utilizas a diario Tweeter puede ser una buena solución para gestionar tu cuenta en Twitter. A través de la página del proyecto de Tweet Nest tienes un pequeño tutorial para configurar la aplicación, ...

Una de las técnicas usadas en Diseño web pasa por mostrar en la página de inicio las últimas noticias, bien sea a través de un Blog o como presentación de productos en una tienda. Orbit es otro excelente plugin para mostrar un Slider de imágenes en gran tamaño, además lo puedes implementar fácilmente en tu página web. A través de la página del proyecto te explica de forma sencilla como utilizar este plugin y lo podrás implementar en cualquier plataforma: WordPress, Blogger, Drupal, Joomla… te decimos como hacerlo en DiarioTHC. Para ello tendrás que descargar Orbit Kit desde su página. También necesitarás descargar jQuery. Ahora referencia en la página que vaya a ir el Slider las 2 clases (entre las etiquetas <head></head>), jQuery primero y Orbit después, de la siguiente forma: [html] [/html] El siguiente paso es añadir el CSS que quieras. Referencialo en el header también. [html] [/html] Ahora añade el div en el body, donde vaya a ...

CSS3 Menu es una aplicación online gratuita para crear tu propia barra de menús dinámica completamente en CSS3 y además sin utilizar para ello nada de Javascript. Puedes elegir desde la página de este proyecto el diseño que quieres, dispone de estilo Android, Mac y Apple, con variaciones en colores y estilos. Luego puedes visualizar el resultado y descargar el código para tu página, así de sencillo. Además está disponible para Windows y para Mac. Los menús se generan con una estructura de listas en Html y se pueden implementar en horizontal o vertical, con submenús múltiples. Como decimos puedes previsualizar el menú generado, depués de que elijas tu estilo propio y luego descargar el código, listo para usar en tu página web. Puedes ver este ejemplo con estilo Mac o acceder directamente a la página de CSS3 Menu para elegir tu propio diseño. Página web CSS3 ...

PaintbrushJS Playground es una librería desarrollada en Javascript que permite aplicar efectos de imagen en el lado del cliente. Utiliza elemento Canvas y funciona aplicando una clase en jsp a un elemento en la página web y aplicando parámetros con algunos elementos en HTML. Actualmente este proyecto permite aplicar los siguiente efectos: Blur, escala de grises, mosaico, ruido, posterizado de imagen, tonos sepia y tinta de color. Puedes ver una Demo de esta librería y ver como funciona a través de su página web. Te permitirá aplicar cada efecto mediante una barra y ver la rapidez con que aplica los efectos. Recuerda que está desarrollada por completo en Javascript. Además también puedes descargar el código y acceder a la documentación de esta clase. Página web PaintbrushJS Playground Visto en ...

Touch Gallery es un fantástico plugin para presentar galerías de imágenes en navegadores web móviles, está realizado en jQuery y es un plugin muy ligero y fácil de usar. Además con navegadores que posean funciones limitadas mostrará a la perfección las imágenes y también tiene implementadas funciones para dispositivos multitouch. Esta galería desarrollada en jQuery depende directamente de otros 2 plugins para su funcionamiento, transform y activity-indicator, ambos incluidos en el paquete de descarga de Touch Gallery. La forma de uso está explicada desde la página del proyecto y verás lo fácil de usar que resulta, para ello, simplemente tienes que subir tu galería de fotos a tu página y luego añadir al final de la misma el script para que se ejecute este plugin. De esta forma tan sencilla podrás implementar este plugin, en cualquier plataforma con la que trabajes y el resultado es bastante bueno y como decimos de carga ligera, ideal ...

bxCarousel es una fantástico Carrusel para presentación de imágenes o productos muy fácil de personalizar e implementar. Te permite especificar el número de elementos que se mostrarán y adicionalmente los botones para realizar el slide. Además lo puedes configurar de 2 formas posibles, para que el carrusel se mueva automáticamente nada más cargar la página o de forma manual a través de botones. En la forma automática podrás configurar la duración de tiempo entre cada transición, así como la velocidad y dirección de las transiciones de forma simple. Recuerda, bxCarousel, una opción muy interesante de implementar un carrusel para tu página web, bien para imágenes y otros elementos, además puedes personalizar el código de forma sencilla. A través de la web del proyecto de comentan como hacerlo. Página de proyecto ...

PHP RSS Reader en una aplicación gratuita con un servicio de pago que se acaba de actualizar con importantes mejoras y características, la aplicación consigue varios feeds distintos y puede organizarlos dentro de categorías. Parecido a lo que hace Google News, puede mostrar artículos relacionados basados en RSS. Además la versión de pago de PHP RSS Reader te permitirá organizar en categorías el contenido incluyendo palabras clave, además de poder monitorizar el uso. Esta nueva versión dispone de multi-interfaz de usuario con lo que cada usuario podrás crear sus propios feeds y votar por las historias mostradas. PHP RSS Reader puede ser muy interesante para ti si estás creando un sitio con feeds de otros recursos en internet. O también para redes de contenidos y mostrar contenidos similares de otros sitios web así como para monitorizar a través de palabras clave. Además la versión de pago viene con un panel de instalación. Puedes ver una ...

Toucan Css Reset es un framework en CSS que te permitirá minimizar las diferencias de renderizado de objetos entre los diferentes navegadores web y realizará un reset en código Css para mostrar esta compatibilidad. Además recompondrá con las nuevas reglas genéricas para tipografía, cabeceras, listas, formularios, tablas… para que sean compatibles con cualquier navegador y tu página se visualice de igual forma en los distintos navegadores. Toucan Css Reset se trata de un ligero framework, tan solo pesa 2,5 kb comprimido y realmente es fácil de enteder lo que hace. Lo puedes utilizar y aplicar a tus propios trabajos y beneficiarte de la compatibilidad que te proporcionará en todas tus páginas web. Dispones de una Demo, para probar el código con cada elemento en diferentes navegadores y comprobar tu mismo la compatibilidad que ofrece. Perfecto para el diseño ya creado en tus páginas web. Demo Toucan Css Reset Código Toucan Css Reset Introducción y forma de ...

HTML5Rocks es un recurso online de Google que comparte regularmente varios proyectos en Html5 y en Css3. Además añade tutoriales detallados con video en html5 o utilizando @web-fonts. A través de una interfaz realizada en Javascript y con propiedades en CSS3 y Html5 te trae código para que lo visualices de inmediato. También con HTML5Studio con lo que te trae los últimos proyectos como flip de imágenes, video player, carrusel de imágenes, geolocalización y otros proyectos de tipo open source. Además de servirte de inspiración puedes atreverte a implementar estos códigos en tu web. Puedes acceder a todos estos recursos a través de la página del proyecto de HTML5Rocks desde la que puedes navegar y visualizar el contenido con el código implementado en ellas. Página proyecto ...