Efecto parallax

Contactar con el profesor

<style type="text/css">
body{margin:0; background: url(pera.png) fixed;}
.pinas_and_oranges{ position: fixed; width: 100%; height: 1800px; }
.contentLayer{ position: absolute; width: 100%; height: 500px; }
#pinas{ background: url(pina.png) 100px 200px; }
#oranges{ background: url(orange.png) 50px 200px; }
#whiteLayer{top:500px; background: white }
#greenLayer{ top:2500px; background: green}
</style>
<script type="text/javascript">
function parallax(){
	pinas.style.top = -(window.pageYOffset/5)+"px";
	oranges.style.top = -(window.pageYOffset/2)+"px";
}
function start(){
	pinas = document.querySelector("#pinas");
	oranges = document.querySelector("#oranges");
}
window.addEventListener("scroll", parallax);
window.addEventListener("load", start);
</script>
<div id="pinas" class="pinas_and_oranges"></div>
<div id="oranges" class="pinas_and_oranges"></div>
<div id="whiteLayer" class="contentLayer"></div>
<div id="greenLayer" class="contentLayer"></div>

Break! Gran día de repaso

Repasaremos los últimos ejercicios:

  1. El juego del número secreto y aleatorio. Cuando terminemos la partida, nos debe preguntar si queremos volver a jugar.
  2. Calcular el factorial de un número.
  3. Calcular grados centígrados.
  4. Ejercicio del formulario para mandar cajas.
← Calculadora con Javascript
Obtener la letra del DNI →

Aviso Legal | Política de privacidad