Change color of letter after text passes through a div?

0

I have a div that has position: fixed , that is, it accompanies scroll . But I have a problem. Since div have text with a color, to pass over a div % that is darker, the text is not visible. Is there any way to apply the css or%% js for when he came to this div % change to another color?

Here is the code I have:

<div style="position:fixed;right:10px;top: 50%;transform: translateY(-50%);"><i class="fa fa-chevron-right fa-5x"></i></div>

I know I should not use% style on line but as it is only while testing phase, I am doing so for easier handling of the code.

I've heard of the mix-blend-mode method, but I have not been able to put it into practice. How could I use this method?

    
asked by anonymous 01.02.2018 / 16:44

1 answer

-2

Use the: hover as shown below:

HTML

<html>
  <head>
    <title>Exemplo alteração de cor do texto</title>
  </head>
  <body>
    <div class="divMain">Seu texto aqui</div>
    Conteudo do site
  </body>
</html>

CSS

.divMain {
  position: fixed;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: black;
}

.divMain:hover {
  color: red;
}

You can check out link

    
01.02.2018 / 16:58