A topbar modification for strapdown.js (markdown-based webpages)
- Example #1: Left aligned top links[link]
- Example #2: Right aligned top links[link]
- Example #3: (MFixed) Fixed topbar on mobile devices[link]
- Example #4: Testing Header anchor v-alignment[link]
- Example #5: (MFixed) Testing Header anchor v-alignment[link]
Have your topbar setting in the <body>.
<topbarstyle="display:none;"><item><ahref="#">Home</a></item><item><ahref="#">About</a></item><menuname="Dropdown Menu"><item><ahref="#">Item #1</a></item><item><ahref="#">Item #2</a></item><item><ahref="#">Item #3</a></item><item></item><!-- add a divider --><item><ahref="#">Item #4</a></item></menu><toc>My TOC</toc><item><small>(Powered by <ahref="https://github.com/arturadib/strapdown">StrapDown.js</a>)</small></item></topbar>Then, simply include strapdown-topbar.jsAFTERstrapdown.js.
<scriptsrc="https://cdn.jsdelivr.net/gh/arturadib/strapdown@gh-pages/v/0.2/strapdown.js"></script><!-- Include it AFTER strapdown --><scriptsrc="assets/strapdown/strapdown-topbar.min.js"></script><!-- Example: Manually adding a logo --><!-- Include it AFTER EVERYTHING --><scriptsrc="assets/logo.js"></script>Optionally, you can include the following before the js files to force a header text color to avoid link color styling when not hovered.
varSTRAPDOWN_TOPBAR_DEFAULT_COLOR='#555';NOTE! Want more speed? Now available on cdnjs
Or even jsDelivr: https://cdn.jsdelivr.net/gh/joedf/strapdown-topbar@latest/assets/strapdown/strapdown-topbar.min.js