Skip to content

Luca-spopo/strapdown-topbar

 
 

Repository files navigation

strapdown-topbar

A topbar modification for strapdown.js (markdown-based webpages)
cdnjs-ready mobile-ready

Examples

  • 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]

Usage

Have your topbar setting in the <body>.

<topbar style="display:none;">
	<item><a href="#">Home</a></item>
	<item><a href="#">About</a></item>
	<menu name="Dropdown Menu">
		<item><a href="#">Item #1</a></item>
		<item><a href="#">Item #2</a></item>
		<item><a href="#">Item #3</a></item>
		<item></item> <!-- add a divider -->
		<item><a href="#">Item #4</a></item>
	</menu>
	<toc>My TOC</toc>
	<item><small>(Powered by <a href="http://strapdownjs.com/">StrapDown.js</a>)</small></item>
</topbar>

Then, simply include strapdown-topbar.js AFTER strapdown.js.

<script src="http://strapdownjs.com/v/0.2/strapdown.js"></script>
<!-- Include it AFTER strapdown -->
<script src="assets/strapdown/strapdown-topbar.min.js"></script>

<!-- Example: Manually adding a logo -->
<!-- Include it AFTER EVERYTHING -->
<script src="assets/logo.js"></script>

NOTE! Want more speed? Now available on cdnjs

About

a topbar modification for strapdown.js

Resources

Stars

Watchers

Forks

Packages

No packages published

Languages

  • HTML 69.9%
  • JavaScript 30.1%