BLOG DE DISEÑO WEB CORUÑA

Un poco de todo, recursos, tutoriales, noticias, anuncios...

Imagen con Marca de Agua personalizable con jQuery, PHP y jQueryUI

Imagen con Marca de Agua personalizable con jQuery, PHP y jQueryUI

4.351 visitas

Hola amigos, hace mucho que no nos pasamos por aquí a compartir ningún nuevo recurso, por suerte estamos bastante ocupados estas últimas semanas. Pero, siempre es bueno hacerse un hueco para compartir, y en este caso, hemos evolucionado un viejo código que tuvo bastante éxito en este blog como fue el artículo Marca de Agua con PHP.

En este caso, el sistema para agregar una marca de agua dinámica, y proteger así de la copia, a tus queridas imágenes, evoluciona y ahora nos permite redimensionar la marca de agua y ubicarla en la posición deseada y no obligatoriamente al centro como en el anterior artículo.

LEER ENTRADA

Manipulando CSS con jQuery

Manipulando CSS con jQuery

1.898 visitas

Es un orgullo participar por segundo año consecutivo en esta excelente idea que es Octuweb. Si el año pasado hablábamos de como maquetar una tabla en webs adaptativas, este año vamos un poco más allá y veremos como manipular nuestro CSS mediante uso de jQuery.

Propongo diferentes opciones para manipular nuestra hoja de estilos CSS o cambiarla completamente mediante el uso de javascript.

LEER ENTRADA

Responsive jQuery Pop Up Gallery

Responsive jQuery Pop Up Gallery

3.894 visitas

Responsive jQuery Pop Up Gallery es un completo tutorial que te ayudará tu propia galería de imágenes en una ventana emergente.

Cada galería tendrá una pequeña vista previa. El tutorial presenta cinco modelos diferentes de galerías. 

LEER ENTRADA

Protip otro tooltip en Jquery pero mejorado

Protip otro tooltip en Jquery pero mejorado

3.625 visitas

Protip es un tooltip más, de los miles que existen en el aire, pero de nueva generación, con infinidad de opciones y configuraciones.

En su web, justo debajo de la imagen de cabecera, hay una demo funcional con infinidad de opciones configurables a la derecha que permitirán descubrir toda la potencia de este tooltip.

LEER ENTRADA

Google penaliza las webs no adaptadas a dispositivos móviles

Google penaliza las webs no adaptadas a dispositivos móviles

6.866 visitas

Ya sabemos que ser adaptativo (en términos de diseño web) era casi obligatorio... pues bien, esto ha dado un paso de gigante en estos días porque el dios Google ha anunciado que empezará a modificar su algoritmo para perjudicar a aquellas webs que no presenten un contenido adaptado al dispositivo desde el que el usuario hace la búsqueda.

Concretamente, Google ha anunciado recientemente que, a partir del próximo 21 de abril de 2015 aquellas páginas web que no estén totalmente preparadas para móviles muy probablemente irán perdiendo posicionamiento en su buscador con respecto a otras webs optimizadas que ya cuenten con una adaptación específica para móviles o diseño “responsive”.

LEER ENTRADA

Select múltiple con checkboxes y jQuery

Select múltiple con checkboxes y jQuery

16.922 visitas

Muchas veces nos encontramos con la necesidad de crear un select o lista desplegable en la que el usuario pueda seleccionar más de una opción a la vez.

Si nos basamos en el estándar de HTML lo tenemos fácil, existe el tag SELECT con el parámetro multiple activado y pan comido.

LEER ENTRADA

Reemplazar el alert de javascript con SweetAlert

Reemplazar el alert de javascript con SweetAlert

19.687 visitas

Reemplazar el aburrido mensaje de alert o confirm de javascript ya es posible con este pequeño plugin desarrollado en jQuery.

SweetAlert se encargará de cambiar nuestros mensajes al usuario por un bonito y adaptativo falso popup mucho más agradable a la vista, con muy pocas líneas de código.

LEER ENTRADA

Chartist, gráficas sencillas y adaptativas en tu web

Chartist, gráficas sencillas y adaptativas en tu web

7.486 visitas

Chartist no es otra librería para crear gráficas... Chartist surge de la unión de una comunidad que estaba decepcionada con las capacidades de otra librería existente para crear gráficas en tu web.

Por supuesto que hay muchas librerías muy buenas para crear gráficas pero, realmente hay que darle una oportunidad a Chartist.

LEER ENTRADA

Agregar efecto parallax a tu contenido

Agregar efecto parallax a tu contenido

7.167 visitas

DZS Parallaxer es un script que convierte cualquier contenido de tu web en Efecto Parallax.

Presenta un movimiento suave de cualquier contenido que presentes en tu página web, ya sean imágenes, sliders, vídeos o cualquier contenido HTML.

LEER ENTRADA

Slider PRO, slider elegante, responsive y en Jquery

Slider PRO, slider elegante, responsive y en Jquery

8.050 visitas

Slider Pro es uno de los mejores sliders para jQuery que he encontrado desde que cerraron la web de plugins de jQuery.com

Además de las características básicas del slider, tiene muchas opciones configurables, es adaptativo, tiene "lazy load" en las imágenes, es compatible con lightboxes para ampliar las imágenes, soporta contenido html, vídeos, etc...

LEER ENTRADA

CaptionerJS, un plugin jQuery para agregar captions a tus imágenes

CaptionerJS, un plugin jQuery para agregar captions a tus imágenes

5.822 visitas

CaptionerJS es otro, si, otro plugin para agregar captions o subtítulos a tus imágenes en HTML. La gran ventaja de este sobre la gran mayoría es que este plugin no utiliza elementos extras a la imagen para crear los captions.

Qué quiere decir esto? Simple, que se vale del atributo title o alt de tu imagen para crear un caption y usa nuevos elementos data-xxx para configurar si el caption es animado, estático, etc...

LEER ENTRADA

Responsive Tables o tablas adaptativas en CSS

Responsive Tables o tablas adaptativas en CSS

10.289 visitas

Este es un pequeño resumen de un artículo que escribí para el blog Octuweb sobre las diferentes opciones que tenemos los diseñadores para maquetar datos en una tabla HTML en una web adaptativa sin que se vean afectadas ni la usabilidad ni el sentido de la tabla en sí.

Propongo diferentes opciones sin utilizar frameworks, todas soluciones mediante CSS y, al final, sí hay una pequeña recopilación de recursos ya cocinados si basas la maquetación de tu web en algún sistema, tal como Bootstrap, Foundation, etc...

LEER ENTRADA

Combobox de 3 niveles con datos cargados vía Ajax y Json

Combobox de 3 niveles con datos cargados vía Ajax y Json

27.528 visitas

Como prácticamente todo lo que se hace se puede mejorar, mi antiguo artículo del Combobox o Selects Dependientes no iba a ser la excepción y ha llegado la hora de que reciba un pequeño upgrade en su funcionamiento.

Básicamente se trata de lo mismo, de 3 listas dependientes que se relacionan entre sí por un registro en la base de datos que las une... volveremos a llamarlos PADRE, HIJO y NIETO... donde cada uno de nuestros PADRES, ha tenido un HIJO que a su vez le ha dado un NIETO.

LEER ENTRADA

Manteniendo el scroll siempre abajo con StickyScroll

Manteniendo el scroll siempre abajo con StickyScroll

28.177 visitas

A pesar de que su autor no se ha molestado en explicarnos mucho de qué va su plugin, a mi me parece interesante utilizarlo para esos proyectos en los que el refresco de datos por pantalla es continuo y queremos mantener siempre visible la última línea ejecutada.

ScrollGlue pega (literalmente) el scroll bottom del elemento indicado a medida que éste va creciendo en tamaño... es decir, si nuestro divisor o elemento tiene barras de scroll y por javascript, ajax o lo que sea le vamos agregando nuevas líneas (tal como se ve en la imagen de arriba), por defecto, estas nuevas no se verán si no desplazamos el scroll hasta abajo de todo.

LEER ENTRADA

Más de 20 webs con tipografías o recursos para fuentes

Más de 20 webs con tipografías o recursos para fuentes

22.975 visitas

Las Fonts o Tipografías son uno de los elementos esenciales a la hora de diseñar, maquetar, bocetar, etc... no estoy descubriendo nada. En nuestra tarea diaria, ya sea como cualquiera de las actividades a la que nos dediquemos (diseñador, programador, maquetador...) nos encontraremos con la necesidad de trabajar con tipografías.

A raíz de una publicación en Facebook de mi amigo Paco Moreno, les dejo una recopilación de recursos o webs de tipografías que todos deberíamos tener guardadas en nuestros marcadores. Desde librerías de fuentes gratuitas (o no) a identificadores de tipografías, tipografías para gráfica, tipografías para web, en fin, para todos los gustos.

LEER ENTRADA

Selecciona fecha y hora con DateTime picker para jQuery

Selecciona fecha y hora con DateTime picker para jQuery

59.877 visitas

Cuántas veces nos encontramos en nuestros proyectos con la necesidad de que el usuario nos indique la fecha y hora en la que realizó o realizará determinada acción... Habitualmente caemos en las 3 opciones que disponemos que son, o bien mostrar distintos selects para seleccionar día, mes y año y un campo de texto extra para la hora; hacer todo por campos de texto o poner un selector de fecha y selects o inputs de texto para la hora.

Pues bien, si bien no es nuevo, esta opción que traigo es mucho más útil que todo lo anterior para seleccionar una sola vez la fecha y la hora y asegurarnos, al mismo tiempo, que el usuario lo hará de la forma correcta en la que necesitamos esos valores.

LEER ENTRADA

RRSSB botones para compartir en las redes sociales

RRSSB botones para compartir en las redes sociales

22.974 visitas

Puedes quererlos, odiarlos o simplemente que te den igual, pero hoy día, todas las webs y blogs tienen botones para compartir el contenido que estás viendo en tus redes sociales preferidas. Nadie puede discutir, más allá de ésto, la gran oportunidad que presentan de atraer público hacia nuestra página, con lo que tenerlos en nuestra web, a mi entender, suma más de lo que resta.

Pues bien, a las alternativas ya conocidas por todos como Addthis, ShareThis o tantas otras que circulan por ahí, siempre se suma la opción de crear nuestros propios botones, bien sea creándolos en cada una de nuestras redes sociales utilizadas, o utilizando un código genérico y enlazándolo a la opción de share que cada red social posee.

LEER ENTRADA