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

그누보드 모바일 사이드메뉴 상단이동 채택완료

김마린2 3년 전 조회 1,750

 

가능할지 모르겠지만..

 

모바일 사이드메뉴에 상단으로 올리는 고정된 투명화 버튼을 구현하고 싶습니다

 

모바일 메뉴가 많아져서 내렸다가 다시 올리는게 조금 번거로워져서

 

한번에 상단메뉴로 다시 올라가는 버튼을 만들고자 하는데 고수님들 도움 부탁드립니다

 

 

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

답변 1개

채택된 답변
+20 포인트
Dessi
3년 전

style 에서 position과 z-index가 중요하고 bottom과 right 로 위치(아래 예는 우측 하단) 조정 하면 됩니다. 그리고 button 잘보이게 css 먹이시면 되시구요.한번 응용해서보세요.

</p>

<p><style>

#move_top{position: fixed;bottom: 20px;right: 20px;z-index: 99999;width: 50px;height: 50px;}

</style></p>

<p>

<button type="button" id="move_top">↑</button></p>

<p>    <script></p>

<p>        $("#move_top").on("click", function() {

            $("html, body").animate({scrollTop:0}, '300');

            return false;

        });

    </script></p>

<p>

로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

김마린2
3년 전
Dessi 님 매번 감사드립니다!
적용해봤더니 실제 우측하단에 보이긴하는데 이게 사이드바 내에 생기는게 아니네요...
그래서 전체페이지가 이동되고..

사이드메뉴쪽만 상단으로 올리고싶은데 방법이 없을까요?
D
Dessi
3년 전
제가 실문을 자세하게 못보았네요 ㅠㅠ

저 코드가 html 문서를 상단으로 넘기는거라 사이드 메뉴내에서 해결할려면 조금더 심화적인 코드가 필요할것 같습니다.

저걸 사이드메뉴에 넣고 css 선택자를 바꾼다고 해도 html 바디가 올라가겠네요.

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

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

로그인