이아임의 블로그

https://easings.net/ko

사이트에 잘 정리되어있다.

제이쿼리는 일반적으로

$(document).ready( function () {} ); 을 사용하거나 $( function () {} ); 을 사용한다.

순수 자바스크립트로 대체하려면

document.addEventListener( "DOMContentLoaded", function () {} ); 을 사용하면 된다

$(function () {

var navOffset = $(".menu-section").offset().top;

$(window).scroll( function() {

var scrollTop = $(document).scrollTop();

if (navOffset < scrollTop) {

$(".menu-section").addClass('nav-fixed');

$(".menu-section").addClass('top-zero');

} else {

$(".menu-section").removeClass('nav-fixed');

$(".menu-section").removeClass('top-zero');

}

});

});

// 가로길이 document.body.offsetWidth  document.body.scrollWidth // (문서 전체의 크기) document.body.clientWidth // (창의 크기) // 세로길이 document.body.offsetHeight document.body.scrollHeight //(문서 전체의 크기) document.body.clientHeight // (창의 크기) // 가로 길이 window.innerWidth // 브라우저 윈도우 두께를 제외한 실질적 가로 길이 window.outerWidth // 브라우저 윈도우 두께를 포함한 브라우저 전체 가로 길이 //세로길이 window.innerHeight // 브라우저 윈도우 두께를 제외한 실질적 세로 길이 window.outerHeight // 브라우저 윈도우 두께를 포함한 브라우저 전체 세로 길이

$(window).bind('mousewheel', function(event) {

event.preventDefault();

var timeNow = new Date().getTime()

if(timeNow - lastAnimation < 1500) {

console.log('stop scroll');

return;

}

if (event.originalEvent.wheelDelta >= 0) {

console.log('Scroll up');

}

else {

console.log('Scroll down');

}

lastAnimation = timeNow;

});