Jquery para aplicar tinta a las imágenes
3 seguidores
Hola,
Para un proyecto necesito hacer un módulo Prestashop que en función desde donde se entre a la web (ventana normal o frame), el tema de la web cambie de colores.
El problema es que el template Prestashop que tiene el cliente, algunas partes del diseño son mediante imágenes (principalmente degradados).
El caso es que como las combinaciones de colores serán infinitas, no puedo tener una imagen para cada combinación de colores. He pensado hacer algo parecido a setTint de AS3 (aplicar un relleno de tinta), y mi pregunta es, ¿existe alguna manera de hacerlo mediante jQuery?.
Saludos y gracias
jacoborus
Puedes hacerlo con canvas, modificando este código un poco debería funcionarte.
Lo malo es que hace poco que Microsoft ha decidido implementar canvas en Explorer...
Otro método (aunque es un poco chapucilla) sería preparar Prestashop para redimensionar imágenes .png transparentes y cambiarles el background por css
Alex Bailon
jacobo rus
Este es el código que uso yo para la galaría de mi web, solo que en este ejemplo es pulsando un botón, yo lo tengo con la accion de mouse over. ¿Alguien sabría que numeros hay que cambiar para cambiar el color? ya que he estado probando y lo único que hago es cagarla. Si yo por ejemplo quiero un tono marroncillo o ocre?
jacoborus
No lo he probado, pero supongo que cambiando estas 3 líneas te puedes obtener el tono que quieras:
imgPixels.data[i] = (avg * 0.2 >= 255) ? 255 : avg * 0.2;imgPixels.data[i + 1] = avg;
imgPixels.data[i + 2] = (avg / 0.8 <= 0) ? 0 : avg / 0.8;
Yo he puesto + 20% para el rojo y - 20% para el azul, prueba a cambiar los porcentajes hasta obtener el color que quieras
Alex Bailon
Muchísimas gracias Jacobo rus, has dado en el clavo, cambiando los porcentajes con una sencilla regla de tres, se obtienen los colores que se desean.
Gracias de nuevo!.