125 lines
8.0 KiB
JavaScript
125 lines
8.0 KiB
JavaScript
// setTimeout(() => {
|
|
// var SECTION_HEIGHT = 592;
|
|
// var ADD_SECTION_HEIGHT = 592;
|
|
// var top = 0;
|
|
// var offTop = document.getElementById("metAI");
|
|
// top = offTop.offsetTop;
|
|
// window.addEventListener("scroll", function (event) {
|
|
// let count = window.scrollY;
|
|
// let sectionHeight = SECTION_HEIGHT;
|
|
// console.log("count=", count, "sectionHeight=", sectionHeight, "top=", top)
|
|
// let addHeight = ADD_SECTION_HEIGHT;
|
|
// if (count <= top + sectionHeight) {
|
|
// $(".virtual-comparative-one").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-text-one").addClass("virtual-comparative-active");
|
|
// $(".Avatar_pink").css('bottom', '-125px');
|
|
// $(".Avatar_purple").css('bottom', '40px');
|
|
// $(".Avatar_pink").css('left', '8px');
|
|
// $(".Avatar_purple").css('left', '274px');
|
|
// $(".Avatar_purple").css('opacity', '1');
|
|
// $(".Avatar_pink").css('opacity', '1');
|
|
// $(".Avatar_orange").css('transform', 'scale(1)', 'opacity', '1',);
|
|
// $(".Avatar_Line").css('opacity', '1');
|
|
// $(".Avatar_orange").css('opacity', '1');
|
|
// $(".Avatar_Phantom").css('opacity', '0');
|
|
// $(".virtual-comparative-text-two").removeClass("virtual-comparative-active");
|
|
// } else if (count >= top + sectionHeight && count <= top + (sectionHeight + (addHeight * 1))) {
|
|
// $(".virtual-comparative-text-one").removeClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-text-two").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-two").addClass("virtual-comparative-active");
|
|
// $(".Avatar_pink, .Avatar_purple").css('bottom', '-78px');
|
|
// $(".Avatar_pink, .Avatar_purple").css('left', '214px');
|
|
// $(".Avatar_purple").css('opacity', '0');
|
|
// $(".Avatar_pink").css('opacity', '0');
|
|
// $(".Avatar_orange").css('transform', 'scale(2)');
|
|
// $(".Avatar_Line").css('opacity', '0');
|
|
// $(".Avatar_orange").css('opacity', '0');
|
|
// $(".Avatar_Phantom").css('opacity', '1');
|
|
// } else if (count >= top + (sectionHeight + (addHeight * 1)) && count <= top + (sectionHeight + (addHeight * 2))) {
|
|
// $(".virtual-comparative-two").removeClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-text-two").removeClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-text-three").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-three").addClass("virtual-comparative-active");;
|
|
// } else if (count >= top + (sectionHeight + (addHeight * 2)) && count <= top + (sectionHeight + (addHeight * 3))) {
|
|
// $(".virtual-comparative-four").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-three").removeClass("virtual-comparative-active");
|
|
// } else if (count >= top + (sectionHeight + (addHeight * 3)) && count <= top + (sectionHeight + (addHeight * 4))) {
|
|
// $(".virtual-comparative-five").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-four").removeClass("virtual-comparative-active");
|
|
// } else if (count >= top + (sectionHeight + (addHeight * 4)) && count <= top + (sectionHeight + (addHeight * 5))) {
|
|
// $(".virtual-comparative-six").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-five").removeClass("virtual-comparative-active");
|
|
// } else {
|
|
// $(".virtual-comparative-seven").addClass("virtual-comparative-active");
|
|
// $(".virtual-comparative-six").removeClass("virtual-comparative-active");
|
|
// }
|
|
// });
|
|
// }, 1000);
|
|
|
|
setTimeout(() => {
|
|
var SECTION_HEIGHT = 370;
|
|
var ADD_SECTION_HEIGHT = 370;
|
|
var top = 0;
|
|
var offTop = document.getElementById("metAI");
|
|
top = offTop.offsetTop;
|
|
window.addEventListener("scroll", function (event) {
|
|
let count = window.scrollY;
|
|
let sectionHeight = SECTION_HEIGHT;
|
|
let addHeight = ADD_SECTION_HEIGHT;
|
|
if (count <= top + sectionHeight) {
|
|
$(".one-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".two-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".Avatar_pink").css('bottom', '-125px');
|
|
$(".Avatar_purple").css('bottom', '40px');
|
|
$(".Avatar_pink").css('left', '8px');
|
|
$(".Avatar_purple").css('left', '274px');
|
|
$(".Avatar_purple").css('opacity', '1');
|
|
$(".Avatar_pink").css('opacity', '1');
|
|
$(".Avatar_orange").css('transform', 'scale(1)', 'opacity', '1',);
|
|
$(".Avatar_Line").css('opacity', '1');
|
|
$(".Avatar_orange").css('opacity', '1');
|
|
$(".Avatar_Phantom").css('opacity', '0');
|
|
} else if (count >= top + sectionHeight && count <= top + (sectionHeight + (addHeight * 1))) {
|
|
$(".one-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".two-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".three-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".Avatar_pink, .Avatar_purple").css('bottom', '-78px');
|
|
$(".Avatar_pink, .Avatar_purple").css('left', '214px');
|
|
$(".Avatar_purple").css('opacity', '0');
|
|
$(".Avatar_pink").css('opacity', '0');
|
|
$(".Avatar_orange").css('transform', 'scale(2)');
|
|
$(".Avatar_Line").css('opacity', '0');
|
|
$(".Avatar_orange").css('opacity', '0');
|
|
$(".Avatar_Phantom").css('opacity', '1');
|
|
$(".Avatar_Phantom").css('transform', 'scale(1)');
|
|
$(".patient-images").css('transform', 'scale(0)');
|
|
} else if (count >= top + (sectionHeight + (addHeight * 1)) && count <= top + (sectionHeight + (addHeight * 2))) {
|
|
$(".Avatar_Phantom").css('opacity', '0');
|
|
$(".Avatar_Phantom").css('transform', 'scale(0)');
|
|
$(".patient-images").css('opacity', '1');
|
|
$(".patient-images").css('transform', 'scale(1)');
|
|
$(".two-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".three-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".four-virtual-comparative").removeClass("virtual-comparative-active");
|
|
} else if (count >= top + (sectionHeight + (addHeight * 2)) && count <= top + (sectionHeight + (addHeight * 3))) {
|
|
$(".patient-images").css('opacity', '0');
|
|
$(".image-four-virtual-comparative").css('opacity', '1');
|
|
$(".image-four-virtual-comparative").css('transform', 'scale(1)');
|
|
$(".three-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".four-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".five-virtual-comparative").removeClass("virtual-comparative-active");
|
|
} else if (count >= top + (sectionHeight + (addHeight * 3)) && count <= top + (sectionHeight + (addHeight * 4))) {
|
|
$(".image-four-virtual-comparative").css('transform', 'scale(0)');
|
|
$(".four-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".five-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".six-virtual-comparative").removeClass("virtual-comparative-active");
|
|
} else if (count >= top + (sectionHeight + (addHeight * 4)) && count <= top + (sectionHeight + (addHeight * 5))) {
|
|
$(".five-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".six-virtual-comparative").addClass("virtual-comparative-active");
|
|
$(".seven-virtual-comparative").removeClass("virtual-comparative-active");
|
|
} else {
|
|
$(".six-virtual-comparative").removeClass("virtual-comparative-active");
|
|
$(".seven-virtual-comparative").addClass("virtual-comparative-active");
|
|
}
|
|
});
|
|
}, 1000); |