nolo
(Manuel)
January 26, 2023, 2:58pm
1
When I enable the sidebar navigation, the sidebar shows by default and the first time a user clicks the menu icon, it will hide the sidebar.
Can I reverse this setup, so the landing page shows in full width on initial page load and when a user clicks the menu icon it will reveal the sidebar?
This is somewhat similar as the sidebar seems to be controlled by aria-expanded
attribute
I’d like to show the content of a quoted post (link) by default
The expand arrow is a bit too subtle.
What methods do I have available to do this?
Thanks
[quote post]
1 Like
nolo
(Manuel)
January 26, 2023, 4:00pm
3
Thanks for sharing this! That would be this approach:
<script>
$(document).ready(function(){
jQuery(function(){
jQuery('button.btn-sidebar-toggle).click();
});
})
</script>
Which effects the sidebar to slide to the hidden state. So there’s an automatic animation on document ready which is not that ideal.
I actually also thought that the sidebar is controlled by the aria attribute, so I had tried this:
<script>
$(document).ready(function(){
$("button.btn-sidebar-toggle").attr("aria-expanded","false");
})
</script>
But the attribute is not controlling the state, it’s only indicating it. So that snippet will change the attribute, but not the state
1 Like
Don
January 27, 2023, 10:00am
4
Hello Nolo,
I’ve made a component to achieve this. I hope it helps
4 Likes
nolo
(Manuel)
January 27, 2023, 10:31am
5
Oh yes that helps indeed! That’s what I fumbled with but couldn’t get it to work…
Thanks so much for sharing @Don
2 Likes
vikiedavie
(vikiedavie)
January 27, 2023, 1:43pm
6
Thank you, Don! It’s brilliant!
1 Like
system
(system)
Closed
February 26, 2023, 1:43pm
7
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.