Blocs 5 Masterclass - Offcanvas sidebar & mega menu

Tips and Tricks
1

Hi guys,

Today, I am happy to share with you the new episode of the new video series - BLOCS MASTERCLASS. I have explained all about it in this thread .

This class focuses on using the Bootstrap 5 offcanvas feature to make sidebars and mega menus.

4 Likes
2

@Eldar

I’ve already watched the video in my Bocsmaster account, it was really good! :slightly_smiling_face:

1 Like
3

I must be blind. I don’t find it in my Blocsmaster account?

4

I think @Boss81 means the post I made in the Blocs Master Community.

1 Like
5

Thanks for kind words! A lot more to come soon!

6

@Eldar

Yes, that. I watched it there for the first time.

7

I made the navigation bar sticky, placed a text and an icon in the navigation bar, and gave both the same class and custum attributes.

I have gone to Priviev mode, I scrolled down the page, pressed linked TEXT on the sticky menu, the canvas menu opened, and I closed the canvas menu, the page is where I left it at the bottom, everything is normal.

Now I triggered the Canvas menu with the icon and opened and closed the canvas, the page went to the top.
Why??
:))

8

Hi, can you share the URL?

9

Fantastic work! Your explanation was very clear and helpful.

1 Like
10

Hi Eldar,
Thank you very much for your instructional videos.

I tried locally, unfortunately not available URL.

I want to ask a separate question. How can I show the sticky navbar on top of the canvas when the Canvas is open. is it posibble?

1 Like
11

I am not completely understanding the issue, so it would be helpful if you could upload it somewhere to share with me.

Yes, of course! Just make sure that the z-index of the Navbar is higher than the z-index of the menu. You can add a z-index value by adding a class to the navbar, and setting it in the Positioning tab in the Class Editor.

13

I can see the issue. There is something wrong with the setup. I am not on my Mac to inspect it, but I will try to put together a working version of what you need and send you the project file later.

1 Like
14

Thank you Eldar.