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

nav bar to page section

Community Beginner ,
Jan 24, 2019 Jan 24, 2019

I'm not sure if i am describing this correctly.

I want the nav bar to;

1. stay on the page as you scroll down (which i think i can find out how to)

2. have it so when clicked, the page scrolls down to a different section on the current page.

Dreamweaver / bootstrap4

436
Translate
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 1 Correct answer

Community Expert , Jan 24, 2019 Jan 24, 2019

1. https://getbootstrap.com/docs/4.1/utilities/position/#sticky-top    Follow those instructions about fixed top items to keep the nav up top. Here's an example of it together - https://getbootstrap.com/docs/4.0/examples/navbar-top-fixed/​

2. This is just a simple anchor link. Nothing special for bootstrap - HTML a name Attribute 

Translate
Community Expert ,
Jan 24, 2019 Jan 24, 2019

1. https://getbootstrap.com/docs/4.1/utilities/position/#sticky-top    Follow those instructions about fixed top items to keep the nav up top. Here's an example of it together - https://getbootstrap.com/docs/4.0/examples/navbar-top-fixed/​

2. This is just a simple anchor link. Nothing special for bootstrap - HTML a name Attribute 

Translate
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 ,
Jan 24, 2019 Jan 24, 2019

Bootstrap has an opton called scrollspy:

Tryit Editor v3.6

Translate
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 24, 2019 Jan 24, 2019
LATEST

Named Anchors are deprecated.  There's no telling how long browsers will keep supporting them.   I prefer to use unique IDs instead.

<a href="#section1">Link on same page - section 1</a>

<a href="#section2">Link on same page - section 2</a>

<section id="section1">

This is section 1

</section>

<section id="section2">

This is section 2

</section>

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
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