스크롤이 오른쪽으로 가게 할 수있을까요?

스크롤이 오른쪽으로 가게 할 수있을까요?

QA

스크롤이 오른쪽으로 가게 할 수있을까요?

본문

https://sir.kr/qa/312442

안녕하세요 매번 물어보는 초보입니다.

이 링크 참고하여 스크롤이 오른쪽 끝부터 시작하도록 만들고 싶습니다.

참고하서 만들어 보았는데 작동을 안합니다ㅠ

혹시 어떤제 잘못 된 것인지 알 수 있을까요?

 

<div class="scroll_menu">
<div class="scroll_menu_wrap" id="container">
<div class="scroll_menu_tit">1번매뉴</div>
<div class="scroll_menu_tit">2번매뉴</div>
<div class="scroll_menu_tit">3번매뉴</div>
<div class="scroll_menu_tit">4번매뉴</div>
<div class="scroll_menu_tit">5번매뉴</div>
</div>
</div>

 

 

.scroll_menu {width:100%;background: #fff;font-size: 15px;font-weight: bold;word-spacing: -5px;border-bottom: 1px solid #dcdcdc;}
.scroll_menu_wrap {overflow-x:auto; white-space:nowrap;}
.scroll_menu_wrap::-webkit-scrollbar {display: none;}
.scroll_menu_tit {cursor: pointer;display:inline-block;background:#fff;padding: 15px 0;width:500;vertical-align: middle;text-align:center;margin: 0 10px;border-bottom: 2px solid #fff;color: #333;}

 

 

document.getElementById('container').scrollLeft = 2500;

이 질문에 댓글 쓰기 :

답변 3

document.getElementById('container').scrollLeft = 2500;


<script>
let wid = $('.scroll_menu_wrap').width();
$('.scroll_menu_wrap').scrollLeft(wid);
</script>

jquery
$(".scroll_menu_wrap").scrollLeft($(".scroll_menu_wrap")[0].scrollWidth);
 
 
javascript
document.querySelector(".scroll_menu_wrap").scrollLeft = document.querySelector(".scroll_menu_wrap").scrollWidth;
.scroll_menu_wrap::-webkit-scrollbar {display: none;}
이부분은 스크롤을 감추고 있어요 그외 잘 되는거 같은데요?

 

<div class="scroll_menu">
    <div class="scroll_menu_wrap" id="container">
        <div class="scroll_menu_tit">1번매뉴</div>
        <div class="scroll_menu_tit">2번매뉴</div>
        <div class="scroll_menu_tit">3번매뉴</div>
        <div class="scroll_menu_tit">4번매뉴</div>
        <div class="scroll_menu_tit">5번매뉴</div>
    </div>
</div>
<style>
.scroll_menu {width:100%; background: #fff; font-size: 15px;font-weight: bold;word-spacing: -5px;border-bottom: 1px solid #dcdcdc;}
.scroll_menu_wrap {overflow-x:auto; white-space:nowrap;}
.scroll_menu_tit {cursor: pointer;display:inline-block;background:#fff;padding: 15px 0;width:500;vertical-align: middle;text-align:center;margin: 0 10px;border-bottom: 2px solid #fff;color: #333;}
</style>
<script>
window.onload = function() {
    document.getElementById('container').scrollLeft = document.getElementById('container').scrollWidth;
}
</script>

답변을 작성하시기 전에 로그인 해주세요.
전체 59,636
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT