especificosweb/js/main.js

window.onload = function() {
var req = new XMLHttpRequest();
// first add raf shim
// http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/
window.requestAnimFrame = (function(){
  return  window.requestAnimationFrame       ||
          window.webkitRequestAnimationFrame ||
          window.mozRequestAnimationFrame    ||
          function( callback ){
            window.setTimeout(callback, 1000 / 60);
          };
})();

// main function
function scrollToY(scrollTargetY, speed, easing) {
    // scrollTargetY: the target scrollY property of the window
    // speed: time in pixels per second
    // easing: easing equation to use

    var scrollY = window.scrollY,
        scrollTargetY = scrollTargetY || 0,
        speed = speed || 2000,
        easing = easing || 'easeOutSine',
        currentTime = 0;

    // min time .1, max time .8 seconds
    var time = Math.max(.1, Math.min(Math.abs(scrollY - scrollTargetY) / speed, .8));

    // easing equations from https://github.com/danro/easing-js/blob/master/easing.js
    var PI_D2 = Math.PI / 2,
        easingEquations = {
            easeOutSine: function (pos) {
                return Math.sin(pos * (Math.PI / 2));
            },
            easeInOutSine: function (pos) {
                return (-0.5 * (Math.cos(Math.PI * pos) - 1));
            },
            easeInOutQuint: function (pos) {
                if ((pos /= 0.5) < 1) {
                    return 0.5 * Math.pow(pos, 5);
                }
                return 0.5 * (Math.pow((pos - 2), 5) + 2);
            }
        };

    // add animation loop
    function tick() {
        currentTime += 1 / 60;

        var p = currentTime / time;
        var t = easingEquations[easing](p);

        if (p < 1) {
            requestAnimFrame(tick);

            window.scrollTo(0, scrollY + ((scrollTargetY - scrollY) * t));
        } else {
            console.log('scroll done');
            window.scrollTo(0, scrollTargetY);
        }
    }

    // call it once to get started
    tick();
}


	var availableWidth = [ 500, 1024, 1400, 1920];
	var size=0; 
	var banner=document.getElementById("banner");
	while (window.innerWidth > availableWidth[size] && size < availableWidth.length-1 ) 
		size++;
	banner.src="Images/slider/slide1-"+availableWidth[size]+".jpg";

	var contact= document.getElementsByClassName("contact");
	var tit_curso = document.getElementsByClassName("titulo_curso");
	var desc_curso = document.getElementsByClassName("descripcion_curso");
	var list = document.getElementsByTagName("li");
	var overlay=document.getElementById('overlay-contact');
	var exit=document.getElementById('exit');
	var basicgrey=document.getElementById('basic-grey');
	var logo=document.getElementById('logo');
	var btnconsulta=document.getElementById('btnconsulta');
	var btnok=document.getElementById('ok');

	function curso_click(){ 
		for(var j =0; j < desc_curso.length; j++){
			if (desc_curso[j].getAttribute("tatosa") == this.getAttribute("tatosa"))
				desc_curso[j].style.display="block";
		}
	}
    overlay.onclick = function(){
		overlay.style.display="none";
		basicgrey.style.display="none";
	}
    exit.onclick=function(){
		overlay.style.display="none";
		basicgrey.style.display="none";
	}
	btnok.onclick=function(){
		var params="mail="+document.getElementById("suscribe").value;
		req.open("POST", "newsletter.php", true);
		req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
		req.setRequestHeader("Content-length", params.length);
		req.setRequestHeader("Connection", "close");
		req.onreadystatechange=function(){
		if(req.readyState == 4 && req.status == 200)
			document.getElementById("respuestanewsletter").innerHTML=req.responseText; 
		}
		req.send(params);
	};
	btnconsulta.onclick=function(){
		var params = "nombre="+document.getElementById("name").value;
		params=params+"&mail="+document.getElementById("email").value;
		params=params+"&consulta="+document.getElementById("message").value;
		req.open("POST", "contacto.php", true);
		req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
		req.setRequestHeader("Content-length", params.length);
		req.setRequestHeader("Connection", "close");

		req.onreadystatechange=function(){
		if(req.readyState == 4 && req.status == 200)
			document.getElementById("respuestacontacto").innerHTML=req.responseText; 
		}
		req.send(params);
	};
	for(var i =0; i < tit_curso.length; i++)
		tit_curso[i].onclick=curso_click;

	for(var i =0; i < contact.length; i++)
		contact[i].onclick=showContact;

	for(var i =0; i < list.length; i++)
		if(list[i].firstChild.tagName=="A")
			list[i].firstChild.addEventListener("click", function(e) {
			var target=document.getElementById(this.hash.replace("#",""))
			scrollToY(target.offsetTop, 1500, 'easeInOutQuint');
			if (this.hash=='#footer-outer')
				showContact(); 
			e.preventDefault();
			});

    function showContact() {
		basicgrey.style.display="block";
		overlay.style.display="block";
    }

    var startY=banner.scrollHeight;
	window.onscroll = function () {
        logo.style.opacity=1*(window.pageYOffset > startY ); //bool->int
    };

    var curImg=1;
    setInterval(slide, 8000);

    function slide() {
        banner.className='transp';
        setTimeout(transp, 500);
        curImg++;
        if(curImg>5) curImg=1;
    }
    function transp() {
		banner.src="Images/slider/slide"+curImg+"-"+availableWidth[size]+".jpg";
        banner.removeAttribute('class');
    }
}