테스트 사이트 - 개발 중인 베타 버전입니다

상단 스크롤 버튼 업그레이드

· 1년 전 · 781 · 2

 

/templates/taeho/base.html line 305~
[code]
  // 상단 스크롤 버튼
    $(function() {
        $("#top_btn").on("click", function() {
            $("html, body").animate({scrollTop:0}, '500');
            return false;
        });
    });

=>

  // 상단 스크롤 버튼
  jQuery(function($) {
    var $elem = $("html, body");
    var where = 0;
    $("#top_btn").on("click", function() {
      var windowHeight = $(document).height() - $(window).height();
      var winhalf = windowHeight * 0.5;

      if ($elem.scrollTop() < winhalf) {
        $elem.animate({ scrollTop: $elem.prop("scrollHeight") }, 400);
        where = 1;
      } else {
        $elem.animate({ scrollTop: 0 }, 400);
        where = 0;
      }
    });

    $(document).ready(function() {
      $(window).scroll(function() {
        var windowHeight = $(document).height() - $(window).height();
        var winhalf = windowHeight * 0.5;
        var scrollPos = $(document).scrollTop();
        var scrollPercent = (window.scrollY / (document.documentElement.scrollHeight - window.innerHeight)) * 100;
        var $buttonTop = $("#top_btn");

        if (scrollPos > winhalf) {
          $buttonTop.css({
            "border-color": "red",
            "line-height": "15px",
            "color": "red"
          }).html("<i class='fa fa-arrow-up' aria-hidden='true'></i>");
        } else {
          $buttonTop.css({
            "border-color": "blue",
            "line-height": "15px",
            "color": "blue"
          }).html("<i class='fa fa-arrow-down' aria-hidden='true'></i>");
        }
        if ($("#scroll_percentage").length === 0) {
          $("<p id=\'scroll_percentage\'></p>").appendTo($buttonTop);
        }
        $("#scroll_percentage").text(Math.round(scrollPercent));

      });
    });
  });
[/code]

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 2개

적용해보니 아주 잘 작동하네요. 감사합니다.

1년 전

@sinbi님 감사 합니다.

게시글 목록

번호 제목
178
166
163
162
161
160
149
148
147
136
125
110
98
96
94
93
92
91
90
85
80
76
72
69
68
64
57
56
53
51