Alterar cor de fundo como rolagem de página sem jquery?
Estou tentando fazer uma transição funcionar para que a cor bg desapareça em outra cor, dependendo da posição da página / ou seja. acionado por divs com a mesma classe. Encontrei alguns js aqui (http://codepen.io/Funsella/pen/yLfAG), que funciona exatamente como eu quero na área de trabalho, mas quebra no iPad (não importa o navegador).
Alguém saberia como fazer essa transição com CSS?
Eu encontrei, mas é acionado por um hover ..
Por exemplo..http://jsfiddle.net/L9JXG/1/
.div1 {
height:200px;
width:600px;
position:relative;
background:red;
}
.div1:after {
position:absolute;
width:100%;
height:100%;
content:'';
background:url("http://lorempixel.com/output/business-q-c-640-480-10.jpg");
background-size:cover;
opacity:1;
transition: 3s;
}
.div1:hover:after {
opacity:0;
}