- In Bootstrap 3, to set bootstrap scroll to the bottom of long sticky sidebar is possible using Affix which is handled by “Affix jQuery plugin”.
- Unfortunately, in Bootstrap 4 migration “Affix jQuery plugin” was dropped.
- To achieve this affix property as like as Bootstrap 3, Bootstrap 4 recommends us CSS property i.e., position: sticky; directly in style or implementing position:sticky; on @supports rule.
- Though the position:sticky might not support in all cases, we can adopt the third-party ScrollPos-Styler library.
Example 1: Below example illustrate the how to set Bootstrap 4 scroll to the bottom of long stick sidebar using css properties.
- How to scroll automatically to the Bottom of the Page using jQuery?
- How to accordion scroll to top to open content in Bootstrap ?
- How to make Bootstrap table with sticky table head?
- How to create Responsive Bottom Navigation Bar using Bootstrap ?
- How to create a Collapsed Sidebar?
- How to hide the bullets on list for the sidebar?
- Hide scroll bar, but while still being able to scroll using CSS
- How to set sticky navbar only for first section of page?
- How to create an Affix or sticky Navbar ?
- How to create sticky table headers in Chrome ?
- Create a Sticky Social Media Bar using HTML and CSS
- Difference between bootstrap.css and bootstrap-theme.css
- Include Bootstrap in AngularJS using ng-bootstrap
- Difference Between Bootstrap 3 and Bootstrap 4
- Difference between Bootstrap 4 and Bootstrap 5
- How to hide scroll bar for inactivity?
- How to scroll window using jQuery ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.