- Fixed bug: vertical navigation #1426

- Fixed bug: lazy load of videos #1374
- Fixed bug: Destroy() doesn't clear html/body classes and inline styles #1403
- New feature: smaller sections #1263
- Now anchors can be defined in the HTML markup #1380
- New option 'fitToSectionDelay' #1391

README.md

@@ -2,7 +2,7 @@
 
 ![preview](https://raw.github.com/alvarotrigo/fullPage.js/master/examples/imgs/intro.png)
 ![compatibility](https://raw.github.com/alvarotrigo/fullPage.js/master/examples/imgs/compatible.gif)
-![fullPage.js version](http://img.shields.io/badge/fullPage.js-v2.6.7-brightgreen.svg)
+![fullPage.js version](http://img.shields.io/badge/fullPage.js-v2.6.8-brightgreen.svg)
 [![License](http://img.shields.io/badge/License-MIT-blue.svg)](http://opensource.org/licenses/MIT)
 7Kb gziped!
 
@@ -183,7 +183,7 @@ $(document).ready(function() {
 ```
 
 ### Creating links to sections or slides
-If you are using fullPage.js with anchor links for the sections (using the `anchors` option), then you will be able to use anchor links also to navigate directly to a certain slide inside a section.
+If you are using fullPage.js with anchor links for the sections (using the `anchors` option or the attribute `data-anchor` in each section), then you will be able to use anchor links also to navigate directly to a certain slide inside a section.
 
 This would be an example of a link with an anchor: http://alvarotrigo.com/fullPage/#secondPage/2 (which is the URL you will see once you access to that section/slide manually)
 Notice the last part of the URL ends in `#secondPage/2`.
@@ -211,8 +211,21 @@ We could have used a custom anchor for the slide instead of its index if we woul
 ```
 In this last case, the URL we would use would be `#secondPage/slide3`, which is the equivalent to our previous `#secondPage/2`.
 
+Note that section anchors can also be defined in the same way, by using the `data-anchor` attribute, if no `anchors` array is provided.
+
 **Be careful!** `data-anchor` tags can not have the same value as any ID element on the site (or NAME element for IE).
 
+### Creating smaller sections
+It is possible to use sections or slides which don't take the whole viewport height resulting in smaller sections. This is ideal for footers.
+It is important to realise that it doesn't make sense to have all of your sections using this feature. If there is more than one section in the initial load of the site, the plugin won't scroll at all to see the next one as it will be already in the viewport.
+
+To create smaller sections just use the class `fp-auto-height` in the section you want to apply it. It will then take the height defined by your section/slide content.
+
+```html
+<div class="section">Whole viewport</div>
+<div class="section fp-auto-height">Auto height</div>
+```
+
 ## Options
 
 - `controlArrows`: (default `true`) Determines whether to use control arrows for the slides to move right or left.
@@ -232,6 +245,7 @@ $('#fullpage').fullpage({
 ```
 
 - `anchors`: (default `[]`) Defines the anchor links (#example) to be shown on the URL for each section. Anchors value should be unique. The position of the anchors in the array will define to which sections the anchor is applied. (second position for second section and so on). Using anchors forward and backward navigation will also be possible through the browser. This option also allows users to bookmark a specific section or slide. **Be careful!** anchors can not have the same value as any ID element on the site (or NAME element for IE).
+Now anchors can be defined directly in the HTML structure by using the attribute `data-anchor` as explained here.
 
 - `lockAnchors`: (default `false`). Determines whether anchors in the URL will have any effect at all in the plugin. You can still using anchors internally for your own functions and callbacks, but they won't have any effect in the scrolling of the site. Useful if you want to combine fullPage.js with other plugins using anchor in the URL.
 

jquery.fullPage.css

@@ -201,3 +201,8 @@ html.fp-enabled,
 #fp-nav ul li .fp-tooltip.left {
     left: 20px;
 }
+.fp-auto-height.fp-section,
+.fp-auto-height .fp-slide,
+.fp-auto-height .fp-tableCell{
+    height: auto !important;
+}

jquery.fullPage.js

@@ -1,5 +1,5 @@
 /*!
- * fullPage 2.6.7.1
+ * fullPage 2.6.8
  * https://github.com/alvarotrigo/fullPage.js
  * @license MIT licensed
  *
@@ -47,6 +47,7 @@
     var SECTION_LAST_SEL =      SECTION_SEL + ':last';
     var TABLE_CELL =            'fp-tableCell';
     var TABLE_CELL_SEL =        '.' + TABLE_CELL;
+    var AUTO_HEIGHT =       'fp-auto-height';
 
     // section nav
     var SECTION_NAV =           'fp-nav';
@@ -498,6 +499,13 @@
                 options.css3 = support3d();
             }
 
+            //no anchors option? Checking for them in the DOM attributes
+            if(!options.anchors.length){
+                options.anchors = $('[data-anchor]').map(function(){
+                    return $(this).data('anchor').toString();
+                }).get();
+            }
+
             FP.setAllowScrolling(true);
             container.removeClass(DESTROYED); //in case it was destroyed before initilizing it again
 
@@ -537,7 +545,7 @@
                 $(options.fixedElements).appendTo($body);
             }
 
-            //vertical centered of the navigation + active bullet 
+            //vertical centered of the navigation + active bullet
             if(options.navigation){
                 addVerticalNavigation();
             }
@@ -678,8 +686,8 @@
         }
 
         /**
-        * Adds internal classes to be able to provide customizable selectors 
-        * keeping the link with the style sheet. 
+        * Adds internal classes to be able to provide customizable selectors
+        * keeping the link with the style sheet.
         */
         function addInternalSelectors(){
             //adding internal class names to void problem with common ones
@@ -711,8 +719,8 @@
         * Creates a vertical navigation bar.
         */
         function addVerticalNavigation(){
-            var nav = $(SECTION_NAV_SEL);
             $body.append('<div id="' + SECTION_NAV + '"><ul></ul></div>');
+            var nav = $(SECTION_NAV_SEL);
 
             nav.addClass(function() {
                 return options.showActiveTooltip ? SHOW_ACTIVE_TOOLTIP + ' ' + options.navigationPosition : options.navigationPosition;
@@ -738,7 +746,7 @@
                 nav.find('ul').append(li);
             }
 
-            //centering it vertically 
+            //centering it vertically
             $(SECTION_NAV_SEL).css('margin-top', '-' + ($(SECTION_NAV_SEL).height()/2) + 'px');
 
             //activating the current active section
@@ -1186,13 +1194,16 @@
             var dest = element.position();
             if(typeof dest === 'undefined'){ return; } //there's no element to scroll, leaving the function
 
+            //auto height? Scrolling only a bit, the next element's height. Otherwise the whole viewport.
+            var dtop = element.hasClass(AUTO_HEIGHT) ? (dest.top - windowsHeight + element.height()) : dest.top;
+
             //local variables
             var v = {
                 element: element,
                 callback: callback,
                 isMovementUp: isMovementUp,
                 dest: dest,
-                dtop: dest.top,
+                dtop: dtop,
                 yMovement: getYmovement(element),
                 anchorLink: element.data('anchor'),
                 sectionIndex: element.index(SECTION_SEL),
@@ -1380,9 +1391,14 @@
             if( slide.length ) {
                 destiny = $(slide);
             }
-            destiny.find('img[data-src], video[data-src], audio[data-src]').each(function(){
+
+            destiny.find('img[data-src], source[data-src], audio[data-src]').each(function(){
                 $(this).attr('src', $(this).data('src'));
                 $(this).removeAttr('data-src');
+
+                if($(this).is('source')){
+                    $(this).closest('video').get(0).load();
+                }
             });
         }