JQuery Library Locks Sidebar To The Screen | sidebarFix.js

sidebarFix.js is a library that locks the sidebar inside the browser view area. It works in the browser. Even if the sidebar is longer than the height of the screen, it will automatically adjust its position so that you cannot see the entire sidebar.

The jQuery plugin version of jquery.sidebarFix.js and the standalone version of sidebarFix.js are included with jQuery.

sidebarFix.js is a very small jQuery plugin that makes sidebar tools always visible when scrolling a webpage page down or up. Even if the sidebar is longer than the height of the screen.

How to make use of it:

1. Put each jQuery library and the jQuery sidebarFix.js script within the HTML web page.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="jquery.sidebarFix.js"></script>

2. Create a sidebar and make it sticky inside a particular container.

  frame: $('.container')

3. Set the top offset in instances of the place you’ve got a sticky header nav.

  frame: $('.container'),
  topBuffer: 100

4. Fix the position concern where the sidebar is nested within the container.

  frame: $('.container'),
  force: true

Easy Mobile-friendly Fixed Sidebar, sidebarFix.js Plugin/Github

See Demo And Download

Official Website(tomk79): Click Here

This superior jQuery/javascript plugin is developed by tomk79. For extra Advanced Usage, please go to the official website.

Related Posts


Google Translate Dropdown Customize With Country Flag | GT API

Flag google translates jQuery text that takes advantage of the Google Cloud Translation API to translate web content between languages by selecting a country from the dropdown…


HTML 5 File Input Optimized for Bootstrap 4.x./3.x with File Preview | Bootstrap Fileinput

bootstrap-fileinput is an improved HTML 5 file input  Bootstrap 5.x, 4.x and 3.x with file preview for different files, provides multiple selections, resumable section uploads, and more….


How to Add Floating Whatsapp Chat Button In HTML | venom-button

Venom Button is a very simple plugin for the jQuery floating WhatsApp button. Adds a floating button to your site that calls WhatsApp Click to Chat API. It will automatically start the WhatsApp…


Bootstrap 4 Sidebar Menu Responsive Template | MDB

Bootstrap Side Navbar – Responsive sidebar template based on the Bootstrap 4 framework. An easy-to-use, totally responsive, Google Material Design impressed aspect navigation for modern web app…


Bootstrap 5 Treeview Dynamically Collapsible | bs5treeview

Bootstrap 5 Tree View is a very simple plug-in for creating a basic and elegant Treeview using BS5. For use with Bootstrap 5, the attributes have been…


Modern Mobile Touch Slider With Acceleration Transitions | Swiper

Swiper is the most modern free mobile touch slider with accelerated device transitions and amazing original behavior. It is intended for use in mobile websites, mobile web…

Leave a Reply

Your email address will not be published. Required fields are marked *