질문과 답변

기 타 티스토리에서 눌렀을 때 맨 아래/맨 위로 이동하는 버튼을 만들고 싶습니다

2017.03.10 12:16

TetraTheta 조회:166

구글링 해서 어찌어찌 맨 위로 가는 버튼은 만들었는데, 그걸 고대로 이용해서 맨 밑으로 가려는 버튼을 만드려니까 안되는군요... 여기서 뭘 어떻게 수정해야 할지 여쭈어봅니다.

 

HTML


    <!-- TOP 버튼 추가 -->
    <a href="#" class="jcm-top"><img src="./images/top.png" style="margin-bottom: 60px;width:60px;"></a><!-- 크기 선언 무의미 -->
    <a href="#" class="jcm-bottom"><img src="./images/bottom.png" style="margin-bottom: 60px;width:60px;"></a>
    <script>
      $( document ).ready( function() {
        $( window ).scroll( function() {
          if ( $( this ).scrollTop() > 450 ) {
            $( '.jcm-top' ).fadeIn();
          } else {
            $( '.jcm-top' ).fadeOut();
          }
        } );
        $( '.jcm-top' ).click( function() {
          $( 'html, body' ).animate( { scrollTop : 0 }, 200 ); /* 숫자 작을수록 빠름 */
          return false;
        } );
      } );
    </script>
    <script>
      $( document ).ready( function() {
        $( window ).scroll( function() {
          if ( $( this ).scrollTop() > 450 ) {
            $( '.jcm-bottom' ).fadeIn();
          } else {
            $( '.jcm-bottom' ).fadeOut();
          }
        } );
        $( '.jcm-bottom' ).click( function() {
          $( 'html, body' ).animate( { scrollTop = 0, document.body.scrollHeight }, 200 ); /* 숫자 작을수록 빠름 */
          return false;
        } );
      } );
    </script>

 

 

CSS


/* TOP 버튼 */
a.jcm-top {
    position: fixed;
    right: 15px;
    bottom: 15px;
    border-radius: 5px;
    color: #ffffff;
      text-align: center;
      width: 60px; /* 여기서 크기 조절 */
      height: 60px;
      font-size: 40px;
    background-color: rgba(0,0,0,0.3);
    z-index: 99999;
        display: none;}
a.jcm-top:hover{background-color:#000}
a.jcm-bottom {
    position: fixed;
    right: 75px;
    bottom: 15px;
    border-radius: 5px;
    color: #ffffff;
      text-align: center;
      width: 60px; /* 여기서 크기 조절 */
      height: 60px;
      font-size: 40px;
    background-color: rgba(0,0,0,0.3);
    z-index: 99999;
        display: none;}
a.jcm-bottom:hover{background-color:#000}
 

 

 

이걸 어찌 해야 할까요? 으으으... 일단 업로드된 파일이라던가 다 살펴봐도 이게 전부인거 같은데...

번호 제목 글쓴이 조회 등록일
[공지] 질문과 답변 게시판 이용간 유의사항 gooddew - -
68047 하드웨어| 메인보드와 메모리 호환관련 문의드립니다. [1] 윈포우도럼 288 03-16
68046 기 타| 메인보드만 바꾸면 다른기기가 되나요? [4] cosmosa 688 03-16
68045 윈 도 우| 외장하드로 USB 설치 문의 드립니다. [1] votto 361 03-16
68044 윈 도 우| LG Free Dos 새노트북 스카이레이크에 윈도우7 x64 설치를.. [7] 씻으면이정 1475 03-15
68043 윈 도 우| 윈도우10 에서 사용가능한 램드라이버 추천 부탁드립니다. [4] 뭉게구름 663 03-15
68042 윈 도 우| 문의)) 원도우 부팅시~ 이 부분에서 시간이 많이 걸립니다~... [5] chobits 1155 03-15
68041 윈 도 우| 아랫글에이어 혹시나해서...(시스템파일손상관련) [4] shy1911 256 03-15
68040 기 타| 티스토리 블로그에 웹폰트로 몇가지 기능을 구현하려 합니다 [2] TetraTheta 253 03-15
68039 윈 도 우| Win10AeroPE64 pe.iso 구합니다 [5] gkgk77 1137 03-15
68038 윈 도 우| [윈10] 업데이트 하다가 컴퓨터 전원이꺼지면 [2] shy1911 949 03-15
68037 윈 도 우| 윈10 에서 초기화를 하면 [2] never 942 03-15
68036 기 타| 구글 홈페이지 [5] 오후9시7분 424 03-15
68035 윈 도 우| msconfig 에서 화살표부분의 체크부분을 [6] never 519 03-15
68034 기 타| path 연결 법 문의드립니다. [1] 나양말많아 186 03-15
68033 윈 도 우| 윈도우7 드라이버팩 통합시 오류문의요 [1] 령은아빠 296 03-15
68032 윈 도 우| 노트북 도스프리 샀는데요 [2] 늘푸르다 1010 03-15
68031 소프트웨어| 이게 바보같은 소리라는 건 압니다만.. [6] 늦둥이it 986 03-14
68030 소프트웨어| 데모노이드 초대장 부탁 드립니다. [3] fairlove 308 03-14
68029 윈 도 우| UEFI 시스템에서 BCD 등록 [3] 류비 684 03-14
68028 윈 도 우| themida 오류 이게 뭔가요? [1] titcat 943 03-14
XE1.11.6 Layout1.4.8