• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

How to collapse the menu

Contributor ,
Jan 26, 2023 Jan 26, 2023

Copy link to clipboard

Copied

Hi all,

 

I want the menu to be collapsed if another menu is opened. Herer Criterion I to be closed if i click on Criterion II. Please help.

 

http://bhc.edu.in/naac/CRITERION-V/5.1.1-Scholarship-Freeship-Provided-Government.php#homeSubmenu

 

 

Views

497

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 2 Correct answers

Community Expert , Jan 27, 2023 Jan 27, 2023

Votes

Translate

Translate
LEGEND , Feb 03, 2023 Feb 03, 2023
quote

The issue was fixed.I want the side menu to be fixed and the scroll bars to be appeared. Kindly help.

 

thanks in advance.


By @Roopavathy

 

Replace 'sticky-top' with 'fixed-top' and add height: 100%; and overflow: scroll; to the #sidebar css:

 


<nav id="sidebar" class="fixed-top">

#sidebar
{
height: 100%;
overflow: scroll;
}

Votes

Translate

Translate
Community Expert ,
Jan 27, 2023 Jan 27, 2023

Copy link to clipboard

Copied

See if this helps you.

https://getbootstrap.com/docs/4.0/components/collapse/

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Jan 27, 2023 Jan 27, 2023

Copy link to clipboard

Copied

I tried. But it doesn't work.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Jan 28, 2023 Jan 28, 2023

Copy link to clipboard

Copied

I don't know what you tried, so can't comment. But the various solutions offered do work with Bootstrap 4.

 

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

The issue was fixed.I want the side menu to be fixed and the scroll bars to be appeared. Kindly help.

 

thanks in advance.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

quote

The issue was fixed.I want the side menu to be fixed and the scroll bars to be appeared. Kindly help.

 

thanks in advance.


By @Roopavathy

 

Replace 'sticky-top' with 'fixed-top' and add height: 100%; and overflow: scroll; to the #sidebar css:

 


<nav id="sidebar" class="fixed-top">

#sidebar
{
height: 100%;
overflow: scroll;
}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

I tried the above mentioned code.Scroll bar is disbled as this. Attached screenshot. 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Feb 05, 2023 Feb 05, 2023

Copy link to clipboard

Copied

It works perfectly good. Thank you.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

You could use Bootstrap 5 with the off-canvas component. I have created a video on somthing similar to what you need albeit using a different IDE.

https://youtu.be/vOi6TAK_YlM

Wappler, the only real Dreamweaver alternative.
For any type of content management system, the admin module is the heart of the application. This is where content is created and user systems are maintained. With this video, I will show you how to create a single page app for the Admin module. CSS Code; :root { --offcanvas-width: 250px; ...

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

I am using bootstrap 4 only. Are there any possbilities to do the same here ?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 03, 2023 Feb 03, 2023

Copy link to clipboard

Copied

Have a look here https://mdbootstrap.com/docs/standard/extended/sidebar/

Wappler, the only real Dreamweaver alternative.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Contributor ,
Feb 05, 2023 Feb 05, 2023

Copy link to clipboard

Copied

LATEST

Thanks Ben for your replies. I haven't worked Wappler so far. But came to know about this new feature. Thanks.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines