X
Back to the
Component Shop
Read this first! Accordion Alert / Callout Another Lightbox Gallery Auto Sidebar Backbutton Basic Form Before/After Comparison Buttons Collapsible Alert Contact Form Count-down Script CSS Parallax Cut-out Text Decorative Background Details/Summary Classes Drilldown Menu Drop-down Equal Height Columns Filtered Portfolio Flip-cards Glossary Table Hamburger Menu HTML Quiz Horizontal Tabs Image Gallery Image Modal Image Shapes Image Slider with Fade Jquery Parallax Lazy Loading Lightbox Gallery Masonry Grid Gallery Mega Menu Modal Optimal Image Sizes Oval Image PHP Includes Range Slider Read More Button Responsive Card Table Responsive Navbar Responsive Shrinknav Responsive Sidebar Responsive Table Round Image Scroll to Top Searchbox Simple Shapes Simple Cards Simple Slider Skill Bars Slide-in Nav Subnav in Dropdowns Tabbed Gallery Tab Navigation Text on Image Translucent Image Translucent Text Layer Vertical Tabs Video Video Scroller Wrapping Text Years Completed Zebra Striped Table

Auto Sidebar

Home About Services Clients Contact

Auto Sidebar

Comments

This simple menu lends itself to be used on one-page websites. All the menu links go to sections down on the same page, and you can add as many links as you need. The sidebar is as tall as its content (the links), and is always shown. Important is, of course, that the page has enough contents to scroll at all.

Scroll down the page to see the result. You may need to narrow the viewport a bit.

Download the component.

About

Some content to enable scrolling. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus. Fusce eu varius mi, nec sagittis urna. Duis quis iaculis sapien. Nulla commodo nec urna sed rutrum. Donec et nisi ac sapien tincidunt bibendum eget et ante. Phasellus pulvinar, massa vitae blandit congue, lacus nibh cursus metus, et aliquam augue lorem ac risus. Nam eleifend magna nunc, et semper mauris sagittis at. Aenean sem nisi, vestibulum sagittis arcu eu, viverra tempor purus. Suspendisse aliquam tempus venenatis. Aliquam tempus suscipit lectus, id blandit sem placerat a. In orci sem, auctor euismod nunc ut, consectetur pellentesque urna. Sed tempus aliquam felis, eget efficitur nulla consectetur sed. Sed luctus, tellus vel ultrices iaculis, felis mi venenatis metus, a ultricies augue lacus in eros. Morbi porttitor faucibus vehicula. Ut commodo, neque lacinia pretium tincidunt, risus eros placerat lectus, sit amet posuere tortor augue sit amet urna. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Donec tincidunt ex non nisl euismod mollis. Curabitur sollicitudin volutpat consequat. Aenean rhoncus, magna quis consectetur fermentum, eros diam dapibus quam, nec gravida sem eros hendrerit orci. Maecenas dictum eget quam eget interdum. Sed tincidunt nisl id erat convallis elementum. Fusce dignissim gravida lorem, eu finibus nisi sodales ac. Suspendisse sodales rhoncus porta. Ut ac sodales augue, at porttitor felis. Praesent et mauris vitae dolor dictum iaculis quis in quam.

Services

Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus. Donec sed feugiat nisl, in commodo magna. Donec rutrum lectus dui, suscipit fringilla nunc accumsan eu. Cras eget iaculis sem, nec ornare orci. Nunc ornare pharetra ligula id molestie. Fusce condimentum eu erat ut sodales.

Clients

Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus. Donec sed feugiat nisl, in commodo magna. Donec rutrum lectus dui, suscipit fringilla nunc accumsan eu. Cras eget iaculis sem, nec ornare orci. Nunc ornare pharetra ligula id molestie. Fusce condimentum eu erat ut sodales.

Contact

Some text to enable scrolling.. Lorem ipsum dolor sit amet, illum definitiones no quo, maluisset concludaturque et eum, altera fabulas ut quo. Atqui causae gloriatur ius te, id agam omnis evertitur eum. Affert laboramus repudiandae nec et. Inciderint efficiantur his ad. Eum no molestiae voluptatibus. Donec sed feugiat nisl, in commodo magna. Donec rutrum lectus dui, suscipit fringilla nunc accumsan eu. Cras eget iaculis sem, nec ornare orci. Nunc ornare pharetra ligula id molestie. Fusce condimentum eu erat ut sodales.