0

I'm trying to reproduce a magellan sidebar menu like the one on this link http://jsfiddle.net/mBSA4/

<ul class="magellan tabs vertical" data-magellan-expedition="fixed">
  <li data-magellan-arrival="grid"><a href="#grid">Grid</a></li>
  <li data-magellan-arrival="tabs"><a href="#tabs">Tabs</a></li>
  <li data-magellan-arrival="buttons"><a href="#buttons">Buttons</a></li>
</ul>

But it's in foundation 4 and doesn't seem to work as expected with foundation 5. I'm trying some things but I just can't reproduce a sticky vertical sidebar. What I'm reproducing is a sidebar that goes full horizontal - on top of viewport - when I scroll. Which is not the behavior I want. I want a vertical ul-tab all the time.

Anybody had this resolved?

Thanks a lot

Knut Holm
  • 3,988
  • 4
  • 32
  • 54
Eric Thibeault
  • 91
  • 4
  • 15

1 Answers1

0

Use the HTML code from Foundation 5 - and just replace the class "sub-nav" with "side-nav": 

<dl class="sub-nav">

The code for my vertisidebar Magellan

<div data-magellan-expedition="fixed">
  <dl class="side-nav">
    <dd data-magellan-arrival="tabs"><a href="#tabs">Tabs</a></dd>
    <dd data-magellan-arrival="code"><a href="#code">code</a></dd>
  </dl>
</div>
Gita Street
  • 51
  • 1
  • 2
  • 1
    Perhaps this is for an old version, but it doesn't work for me in Foundation 5.5. As soon as I start to scroll, the side-bar glues itself to the top and loses its right justification. – MyNameIsKo Apr 12 '16 at 14:25