$(document).ready(function(){ 

//Set the anchor link opacity to 0 and begin hover function

$("ul#nav li a").css({"opacity" : 0}).hover(function(){ 

//Fade to an opacity of 1 at a speed of 200ms

$(this).stop().animate({"opacity" : 1}, 200); 

//On mouse-off

}, function(){

//Fade to an opacity of 0 at a speed of 100ms

$(this).stop().animate({"opacity" : 0}, 100); 

});

});

http://callmenick.com/2013/04/22/single-page-site-with-smooth-scrolling-highlighted-link-and-fixed-navigation/

http://www.jqueryscript.net/menu/jQuery-Plugin-For-Single-Page-Scroll-To-Navigation.html

single-page-smooth-scroll-soure.zip

jQuery-Plugin-For-Single-Page-Scroll-To-Navigation.zip

$(".버튼클래스").click(function(){ $(".이벤트 대상자").stop().animate({"margin-top" : "0"}, 500); });

$(".버튼클래스").click(function(){ $(".이벤트 대상자").stop().animate({"margin-top" : "-600px"}, 500); });

$(".버튼클래스").click(function(){ $(".이벤트 대상자").stop().animate({"margin-top" : "-1200px"}, 500); });

$(".버튼클래스").click(function(){ $(".이벤트 대상자").stop().animate({"margin-top" : "-1800px"}, 500); });

<div class="main1" id="mainTop">

<img  src="../image/test/mainImg01.png"/>

</div>

<div><a class="page" href="#mainTop" title="DASAN TOOL"></a></div>

jQuery(document).ready(function($) {

   $(".page").click(function(event){            

        event.preventDefault();

        $('html,body').animate({scrollTop:$(this.hash).offset().top}, 500);

   });

});