Foundation 5 Sticky Div

Question

I ZURB Foundation 5 verwende und ich versuche, die folgendes zu erreichen:

Ich habe eine row, die ein Suchfeld irgendwo in der Mitte der Seite befindet enthält. Ich möchte Stick die <div>, die das Suchfeld enthält oben einmal Benutzer scrollt nach unten. Gibt es in Foundation 5 eine eingebaute Klasse, um das zu tun, und wenn nicht, was ist ein alternativer Weg dazu? Beachten Sie, dass ich darauf achten muss, dass ich nicht den Abstand von oben zum div (Scroll-Abstand) angeben muss.

Answer 1

ich Magellan empfehlen dieses 5.

in Foundation tun können Sie den folgenden Code in Ihrer Seite einzufügen:

<div data-magellan-expedition="fixed"> 
    <div class="row" data-magellan-arrival="search"> 
    <div class="large-12 columns"> 
     <a name="search"></a> 
     <div class="row collapse" data-magellan-destination="search"> 
     <div class="small-10 columns"> 
      <input type="text" placeholder="Search the database"> 
     </div> 
     <div class="small-2 columns"> 
      <button class="button postfix expand">Go</button> 
     </div> 
     </div> 
    </div> 
    </div> 
</div> 

ich dieses example in CodePen