scrollify.js에서 부드럽게 스크롤 하는 버튼 만들기

<a href="">로 이동할 때 바로 이동되지 않고 스크롤을 부드럽게 하는 코드는

html {scroll-behavior: smooth;}

인데, scrollify.js와 함께 사용하니 이상하게 동작한다. 굉장히 느리고 답답하게.

 

 

scrollify.js 데모사이트에서 방법을 확인했다.

$(function() {
        $.scrollify({
           	section : ".scroll-section",
           	//interstitialSection:".header, .footer",
           	//scrollSpeed: 500,
         	});
	  	$(".scroll-down").click(function(e) {
    		e.preventDefault();
    		$.scrollify.next();
  		});
});

next() 외에도 다양한 메소드를 홈페이지에서 확인할 수 있다.

 

최상단 section으로 가는 버튼은 아래와 같이 짤 수 있겠다.

$(function() {
        $.scrollify({
           	section : ".scroll-section",
           	//interstitialSection:".header, .footer",
           	//scrollSpeed: 500,
        });
	  	$(".scroll-down").click(function(e) {
    		e.preventDefault();
    		$.scrollify.next();
        });
		$(".scroll-top").click(function(e) {
    		e.preventDefault();
	    	$.scrollify.move("#section1");
        });
});