사이드바를 기본적으로 숨기게 설정할 수 있나요?

사이드바 내비게이션을 활성화하면 기본적으로 사이드바가 표시되고, 사용자가 메뉴 아이콘을 처음 클릭하면 사이드바가 숨겨집니다.

이 설정을 반대로 변경할 수 있을까요? 즉, 페이지가 처음 로드될 때 랜딩 페이지가 전체 너비로 표시되고, 사용자가 메뉴 아이콘을 클릭하면 사이드바가 나타나도록 하는 것입니다.

사이드바가 aria-expanded 속성에 의해 제어되는 것 같으므로, 이는 어느 정도 유사합니다.

공유해 주셔서 감사합니다! 이 접근 방식이 될 것 같습니다:

<script>
    $(document).ready(function(){ 
        jQuery(function(){
            jQuery('button.btn-sidebar-toggle).click();
        });
    }) 
</script>

이 코드는 사이드바가 숨겨진 상태로 슬라이드하도록 합니다. 즉, 문서가 준비될 때 자동으로 애니메이션이 실행되는데, 이는 이상적이지 않습니다.

사실 저는 사이드바가 aria 속성에 의해 제어된다고 생각해서, 다음을 시도해 보았습니다:

<script>
  $(document).ready(function(){ 
    $("button.btn-sidebar-toggle").attr("aria-expanded","false");    
  }) 
</script>

하지만 이 속성은 상태를 제어하는 것이 아니라 상태만을 나타내는 것입니다. 따라서 이 스니펫은 속성은 변경하지만 상태는 변경하지 않습니다 :upside_down_face:

Nolo님, 안녕하세요!

이를 구현하기 위해 컴포넌트를 만들었습니다. 도움이 되길 바랍니다 :slightly_smiling_face:

오, 정말 도움이 되네요! :smile: 제가 막연히 시도해 보긴 했는데, 결국 작동이 안 됐거든요..

공유해 주셔서 정말 감사합니다 @Don :star2:

당신, 돈! 정말 훌륭해요!