jQuery Plugin For Full Containers with Scroll Animation Support - FullContent

FullContent is a simple and easy-to-use jQuery plugin for creating full containers with width and height of window. Each container could have vertical and horizontal position set. The plugin also supports scroll animation effects between containers by integrating with jQuery Scrollto plugin.

Basic Usage:

1. Markup html structure

<div id="teste">
<div id="stage" class="stage">
<h1>Stage1</h1>
<a href="#stage2">Go to stage2</a> </div>
<div id="stage2" class="stage scrollv">
<h1>Stage2</h1>
<h2>Try resize to see vertical scroll</h2>
<a href="#stage3">Go to stage3</a>
<p>....</p>
</div>
<div id="stage3" class="stage">
<h1>Stage3</h1>
<a href="#stage4">Go to stage4</a> </div>
<div id="stage4" class="stage">
<h1>Stage4</h1>
<a href="#stage">Go to stage1</a> </div>
</div>

2. Include jQuery library, jQuery Scrollto plugin and jQuery FullContent plugin on the page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="js/scrollTo.min.js"></script> 
<script src="js/jquery.fullContent.min.js"></script> 

3. The javascript

$('#teste').fullContent({
children: 'div',
mapPosition: [{v: 1, h: 1}, {v: 1, h: 2}, {v: 2, h: 1}, {v: 2, h: 2}],
stageStart: 1,
idComplement: 'page_'
});

Change log:

2014-09-17

• Easing Functions

---

This awesome jQuery plugin is developed by zehfernandes. For more Advanced Usages, please check the demo page or visit the official website.