질문란에 소스요청해서 죄송합니다만.
혹시 아래 사이트의 우측에 있는 화살표가 항상 화면의 하단에 위치해있고 클릭하면 위로 올라가는 방식의 소스 가지고 계신분 있으신가요?
답변 1개
좀더 자신에 맞는 기능을 구현하고 싶으시면 플러그인을 찾아 적용시키거나
참고해서 작업하시면 됩니다
-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();
};
});
});
답변을 작성하려면 로그인이 필요합니다.