JavaScript - Cambiar color svg dependiendo del color del background

 
Vista:
Imágen de perfil de Diego

Cambiar color svg dependiendo del color del background

Publicado por Diego (1 intervención) el 11/04/2022 12:32:04
Buenos días y gracias de antemano, estoy tratando de hacer que varios iconos svg de redes sociales cambien de blanco a violeta si el fondo es blanco y viceversa si el fondo es violeta al ir haciendo scroll down sobre la página. He provado de mil maneras y no lo consigo.

La URL en cuestión es: http://prointe.es/desarrollo/casaruralcaravaca/
Captura
Captura2

¿Alguna solución?
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Ivan

Cambiar color svg dependiendo del color del background

Publicado por Ivan (118 intervenciones) el 11/04/2022 19:21:57
Hola,

Esta web que mencionas y sus iconos sociales usa la colección de https://fontawesome.com/ la cual tiene una serie de iconos gratuitos que puedes usar en tus web poniendo un simple enlace en el <head>

Una vez tienes esta colección enlazada a tu web puedes añadirlos a elementos html como si fuera una simple reglas css.
En este caso el código que usan para el icono de facebook es:

1
<i class="fab fa-facebook"></i>

Este icono, en la web que mencionas, es blanco con fondo transparente por lo que no cambia de color en realidad, sinó que simplemente se ve el fondo por ser tranparente, el icono siempre es blanco. Cuando sigues haciendo scroll y pasa por un fondo blanco "desaparece" al mezclarse fondo y primer plano en color blanco.


Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar