Adding "data-bs-spy" function to page menu

4 replies · opened Sep 16, 2024

SschnatziSep 23, 2024

A short word like "we're looking on it" or "take a look at the Bootstrap documenation and built it without the canvas template on yor own" or whatever was helpful.

SSemicolon WebSTAFFSep 24, 2024

Hello,

Apologies for the Delays in replying.

We recommend using our Inbuilt Functionality for a more reliable experience. Please consider checking this Template: https://canvastemplate.com/index-onepage-2.html . For the Navigation use this:
[ch_pre]<nav class="page-menu-nav one-page-menu">
<ul class="page-menu-container">
<li class="page-menu-item">Start
<li class="page-menu-item">About
<li class="page-menu-item">Work
<li class="page-menu-item">Team
<li class="page-menu-item">Services
<li class="page-menu-item">Pricing
<li class="page-menu-item">Blog
<li class="page-menu-item">Testimonials
<li class="page-menu-item">Contact

</nav>[/ch_pre]

Then, simply adding the .page-section Class to the Section as required:
[ch_pre]<section id="section-about" class="page-section">[/ch_pre]

This will definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

SschnatziSep 24, 2024

Great!
Thank you very much!

SschnatziSep 26, 2024

This works quite good.
There is only one thing I'm not able to fix:
Clicking on the link the page is shown with the linked anchor directly beginning under the page-menu's visual line.
But the link on the page-menu is not active then. You have to scroll the page until the anchor visually closes up with the page's main menu - then the link switches active.
I have gone through the css in the file style.css ( #page-menu {.... ) but am not able to set it up.

I'd be happy when you gave me some advice.
Thank you!

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard