그누보드 - 상단으로 가기 버튼 만들기
상단으로 가기란?
사이트 우측 하단에 위치 하며 클릭시 최상단으로 이동 합니다.
동영상 설명
Step 1
위와 같은 아이콘 사이트 같은 곳에서 적당한 이미지를 다운 받습니다.
Step 2
파일 업로드
받은 이미지를 업로드 하시고 이미지 경로를 아래 HTML 에 맞게 수정 합니다.
tail.php
<a href="#header" id="goto-top" class="dno"><img src="./images/UpCircle-32.png" alt="TOP" /></a>
style.css ( 자신이 사용하는 메인 style )
#goto-top{position:fixed;bottom:20px;right:20px}
.dno{display:none}
tail.php
<script src="스크립트 경로/grz_top.js"></script>
또는
<script>
$( document ).ready(function() {
var offset_top = 250;
var scroll_duration = 600;
var $go_to_top = $('#goto-top');
$(window).scroll(function(){
( $(this).scrollTop() > offset_top) ? $go_to_top.removeClass('dno') : $go_to_top.addClass('dno');
});
$go_to_top.on('click', function(event){
event.preventDefault();
$('body,html').animate({
scrollTop: 0 ,
}, scroll_duration
);
});
});
</script>
댓글 3개
9년 전
이거 찾고 있었는데 . 감사합니다~~^^
llovemini
8년 전
찾고있었는데 감사합니다|
riggive
8년 전
감사합니다. 마침 필요하던건데 추천하고 갑니다.
게시판 목록
그누보드5 팁자료실
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 | 3년 전 | 4427 | ||
| 24 | 12년 전 | 7371 | ||
| 23 | 12년 전 | 5225 | ||
| 22 |
JMoon
|
12년 전 | 6247 | |
| 21 |
오늘도망했다
|
12년 전 | 13482 | |
| 20 | 12년 전 | 4322 | ||
| 19 | 12년 전 | 8047 | ||
| 18 | 12년 전 | 6513 | ||
| 17 | 12년 전 | 5414 | ||
| 16 | 12년 전 | 6132 | ||
| 15 | 12년 전 | 5613 | ||
| 14 | 12년 전 | 9230 | ||
| 13 | 12년 전 | 8200 | ||
| 12 | 12년 전 | 4951 | ||
| 11 | 12년 전 | 7268 | ||
| 10 |
 vitamin |
12년 전 | 8958 | |
| 9 | 12년 전 | 7553 | ||
| 8 | 12년 전 | 8128 | ||
| 7 | 12년 전 | 7327 | ||
| 6 | 12년 전 | 7457 | ||
| 5 | 12년 전 | 7375 | ||
| 4 | 12년 전 | 7464 | ||
| 3 | 12년 전 | 6960 | ||
| 2 | 12년 전 | 5805 | ||
| 1 | 12년 전 | 12129 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기