맨 위로 올라가는 버튼#1

rhesus2016·2019년 5월 24일
0

프론트엔드

목록 보기
15/16
post-thumbnail

HTML

<div id="top">
    <a href="#top" class="topbutton preventD">TOP</a>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

CSS

#top{width: 100%; height: 2000px;}
#top .topbutton{position: fixed; bottom: 0; right: 0;}

JAVASCRIPT

$(document).ready(function(){
    function preventD(a){
        a.click(function(event){
            event.preventDefault();
        });
    }
	function aniLink(link){
		var target = $(link.attr('href')).offset().top;
		$('html,body').stop().animate({scrollTop:target},800,'swing');
	}
    
	preventD($('.preventD'));

    $('.topbutton').click(function(event){
        aniLink($(this));
    });
});
profile
TJ

0개의 댓글