Skip to content

gestixi/scroll-fixer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Scroll Fixer

This jQuery plugin make it easy to fix elements one the top of the page when scolling down.

You can see it in action on our website.


Installation

form-submitter depends on jQuery. To use it, include this in your page :

<script src="jquery.js" type="text/javascript"></script>
<script src="scroll-fixer.js" type="text/javascript"></script>

Usage

$(document).ready(function() {
  $('.menu').scrollFixer();
});

Options

didFix {function}

Callback called when the element is fixed.

Example:

$('.menu').scrollFixer({
  didFix: function() {
    console.log('This element is fixed: ', this.element);
  }
});

didUnfix {function}

Delegate to allow or not to fix the element.

canFix {function}

Delegate to allow or not to fix the element.

Example:

$('.menu').scrollFixer({
  canFix: function(element) {
    var width = $(window).width();

    if (width <= 480) {
      return false;
    }

    return true;
  }
});

marginTop {number}

Margin to apply at the top of the element when it is fixed.

Default: 0

boxShadow {string}

Box-shadow to add when the element is fixed.

Note that if two elements are stick together, the box shadow will only be apply to the last element.

Default: '0 2px 10px rgba(0,0,0,0.25)'

zIndex {number}

Value that will increment the z-index CSS property when the element is fixed.

Default: 100


Properties

element

The DOM element.

Example:

$('form').formSubmitter({
  didFix: function(evt) {
    console.log(this.element);
  }
});

options

The options object.


Author

Nicolas Badia


Copyright and license

Copyright 2012-2018 GestiXi under The MIT License (MIT).