채택완료

혹시 이런 소스 소장하고 계시분 계신가요?

2018-08-29 (수) 10:47:00 2,369

질문란에 소스요청해서 죄송합니다만.

혹시 아래 사이트의 우측에 있는 화살표가  항상 화면의 하단에 위치해있고 클릭하면 위로 올라가는 방식의 소스 가지고 계신분 있으신가요? 

http://tendency.co.kr/

|

답변 1개

채택된 답변
+20 포인트
2018-08-29 (수) 10:55:44

좀더 자신에 맞는 기능을 구현하고 싶으시면 플러그인을 찾아 적용시키거나

참고해서 작업하시면 됩니다

-html-

<div class="scrollUp" onclick="javascript:scrollUp();">topimg</div>

--css--

.scrollUp { display: none; position: fixed; right: 10%; bottom: 80px; padding: 10px 11px; font-size: 13px; line-height: 100%; text-align: center; color: #fff; background-color: #222; border-radius: 3px; z-index: 10000; cursor: pointer; -webkit-transition: background-color 0.2s; -o-transition: background-color 0.2s; transition: background-color 0.2s; } .scrollUp:hover { background-color: #555; }

--script--

var scrollUpDelay = 1;

var scrollUpSpeed = 30;

function scrollUp()

{

    if(document.body.scrollTop<1)

    {

        return;

    }

    document.body.scrollTop=document.body.scrollTop-scrollUpSpeed;     setTimeout('scrollUp()',scrollUpDelay);

}

$(document).ready(function() {

        $(window).scroll(function() {

            if($(document).scrollTop() > 300) {

                  $('.scrollUp').fadeIn();

             } else {

                  $('.scrollUp').fadeOut();

            };

       });

});

답변을 작성하려면 로그인이 필요합니다.