How to Use ScrollSpy

[edit] Please Note

These docs are now deprecated, we have a new Support area located here

(Difference between revisions)
Line 13: Line 13:
 
<div class="row">
 
<div class="row">
 
   <div class="span4">
 
   <div class="span4">
       <p>Some content here.</p>
+
       <p><img src="http://placehold.it/200x200" alt="Place Holder"></p>
 
   </div>
 
   </div>
 
   <div class="span4">
 
   <div class="span4">
       <p>Some content here.</p>
+
       <p><img src="http://placehold.it/200x200" alt="Place Holder"></p>
 
   </div>
 
   </div>
 
   <div class="span4">
 
   <div class="span4">
       <p>Some content here.</p>
+
       <p><img src="http://placehold.it/200x200" alt="Place Holder"></p>
 
   </div>
 
   </div>
 
</div>
 
</div>
 
</html>
 
</html>

Revision as of 17:51, 10 May 2012

New in PageLines 2.2

In PageLines Framework 2.2, we have added a new Section called ScrollSpy. The ScrollSpy section adds an additional navigation bar that automatically updates nav targets based on scroll position. It is also useful for jumping from one section of your page to another instantly.

In order to get ScrollSpy working on your page, it needs to be enabled in the Drag and Drop menu, and in the Template Setup. area.

More info on template setup here

The ScrollSpy navigation bar will travel with your user as they scroll through your page, so it is best to position this section at the top of the Page Template. It is also important to remember that even though ScrollSpy is a navigation tool, it does not use Wordpress's Menu System, and needs to be configured manually.


How it Works

ScrollSpy works within your Page's editor, as long as ScrollSpy is enabled on the template your page is using. For a more in depth look and tutorial on how to get ScrollSpy working on your page, please visit the new PageLines Framework 2.2 Demo Site.

Place Holder

Place Holder

Place Holder