es.hideout-lastation.com
Paraíso Para Los Diseñadores Y Desarrolladores


Entrada de color dominante de imagen a fondo con AdaptiveBackgrounds.js

Al mostrar algo en la Web, a algunos desarrolladores a menudo les resulta difícil decidir qué fondos son los más adecuados para su uso. Una buena combinación del fondo con el contenido correcto puede afectar sustancialmente la experiencia del usuario. Para algunos diseñadores, prefieren usar algunos de los colores dominantes dentro del contenido en sí; AdaptiveBackgrounds.js puede hacerlo automáticamente.

AdaptiveBackgrounds.js es un plugin de jQuery gratuito que te ayuda a adaptar fácilmente el color más dominante en tu contenido como parte del fondo. Fue construido sobre RGBaster, hecho por el mismo desarrollador.

Básicamente, es un complemento para extraer la paleta de colores de una imagen para obtener el color dominante . La primera vez que se carga la página, el complemento extraerá el color de la imagen. El color extraído se aplica a la imagen principal. Puedes ver cómo funciona en este gif.

(Fuente de la imagen: AdaptiveBackgrounds.js)

Empezando

AdaptiveBackgrounds.js requiere que la biblioteca jQuery funcione. Aunque está construido sobre RGBaster, no es necesario que lo incluyas más. Puede obtener el archivo de complemento desde su página de GitHub.

Luego incluya todos los archivos necesarios en su proyecto de la siguiente manera:

Adaptar el color dominante

Vamos a probar esta herramienta y usarla para extraer el color dominante de esta imagen. Fotografía de doble arco de Kartik Ramanathan, luego aplicarla al elemento padre.

Para que el color dominante se aplique a un elemento, debe poner la imagen como el elemento secundario de este. Dentro de la etiqueta img, proporcione el atributo de data-adaptive-background los data-adaptive-background, como tal, para que el script pueda obtener el color:

Para obtener más ejemplos y configuraciones adicionales, puede visitar la página de documentación de AdaptiveBackgrounds.js .

Pensamiento final

Con AdaptiveBackgrounds.js, obtendrá solo un color estático. Es posible que desee intentar darle un poco más de color a su fondo para obtener un resultado llamativo. Si lo hace, consulte la página de demostración de AdaptiveBackgrounds.js para obtener más ideas.

Cómo transmitir audio truncado utilizando MediaSource API

Cómo transmitir audio truncado utilizando MediaSource API

Con MediaSource API, puede generar y configurar flujos de medios directamente en el navegador. Le permite realizar una variedad de operaciones en datos multimedia contenidos en etiquetas HTML relacionadas con medios tales como o . Por ejemplo, puede mezclar diferentes flujos, crear medios superpuestos, medios de carga diferida y editar métricas de medios, como cambiar el volumen o la frecuencia.

(Consejos de tecnología y diseño)

Cómo habilitar SSL para Localhost usando MAMP

Cómo habilitar SSL para Localhost usando MAMP

Tener una SSL (Socket Secure Layer) instalada es una forma de proteger su sitio web. Básicamente, SSL cifrará las transacciones de datos entre el navegador y el servidor. Por lo tanto, es probable que desee probar su sitio web en un entorno SSL ya en las etapas de desarrollo .Las URL y otros activos del sitio web como CSS y JavaScript se señalan correctamente a través del protocolo https . En

(Consejos de tecnología y diseño)