Recently I've created a code that rotates objects, the code works more or less, I've cleaned it, but it still looks messy and it's a little buggy. The code works but when you open the Chrome console and close it the code stops working, please help me!
$(document).ready(function(){
var gradi = [];
for (var i = 0; i < 6; i++) {
gradi[i] = 0;
};
var scheda = [];
for (var i = 1; i < 7; i++) {
scheda[i] = $("main div:nth-child("+i+")").offset().top;
}
var schermo = $(window).height();
$(window).on("scroll", function(){
var percorso = $(this).scrollTop();
if (percorso > scheda[1] && percorso < scheda[2]) {
var quantita = (percorso-scheda[1])/10;
ruota(1, quantita);
} else if (percorso > scheda[2] && percorso < scheda[3]) {
var quantita = (percorso-scheda[2])/10;
ruota(2, quantita);
} else if (percorso > scheda[3] && percorso < scheda[4]) {
var quantita = (percorso-scheda[3])/10;
ruota(3, quantita);
} else if (percorso > scheda[4] && percorso < scheda[5]) {
var quantita = (percorso-scheda[4])/10;
ruota(4, quantita);
} else if (percorso > scheda[5] && percorso < scheda[6]) {
var quantita = (percorso-scheda[5])/10;
ruota(5, quantita);
} else {
$(".hero").css({ transform: "rotateX(0deg)"});
}
});
function ruota(i, n){
var indice = i-1;
var opacita = n/110;
gradi[indice] = n;
$("main > div:eq("+indice+") > div")
.css({ transform: "rotateX("+gradi[indice]+"deg)", opacity: 1-opacita });
$("main > div:eq("+i+") > div")
.css("transform", "rotateX(0deg)");
}
});
Aucun commentaire:
Enregistrer un commentaire