Boa tarde! Estou precisando que, ao rolar a página do meu site pela barra de rolagem ou scroll do mouse, a logotipo seja substituida.
Minha logo está inserida na página por meio de uma classe no bootstrap.css Segue:
.logo1{
background: url(../img/logoo.png) no-repeat;
height: 164px;
width: 172px;
padding: 15px 15px;
font-size: 18px;
line-height: 20px;
float: left;
position: absolute;
}
.logo2{
background: url(../img/logoclube.png) no-repeat;
height: 78px;
width: 61px;
padding: 15px 15px;
font-size: 18px;
line-height: 20px;
float: left;
position: absolute;
}
O que eu preciso é que, ao rolar a página, a classe chamada .logo1 seja substituída pela classe .logo2 e consequentemente a imagem original da página inicial seja substituida.