##### ScrollFire

settings Settings arrow_drop_down

- Access1
- Profile2
- Notifications

ScrollFire is a jQuery Plugin that executes callback functions depending on how far into the page you've scrolled. We'll show you how you can use this plugin with many demos and examples.

#### jQuery Plugin Options

Option Name | Description
--- | ---
selector | The selector for the element that is being tracked.
offset | If this is 0, the callback will be fired when the selector element is at the very bottom of the user's window.
callback | Execute a callback function when the user scrolls to the threshold. It will only be called once. The callback provides a parameter which refers to the current element selected.

#### jQuery Plugin Initialization

    var options = [
      {selector: '.class', offset: 200, callback: customCallbackFunc },
      {selector: '.other-class', offset: 200, callback: function() {
        customCallbackFunc();
      } },
    ];
    Materialize.scrollFire(options);

#### ScrollFire Demo

Scroll through slowly to get sense of what ScrollFire can do for you. This is the ScrollFire code that we have used on this page.

    var options = [
    {selector: '#staggered-test', offset: 50, callback: function(el) {
      Materialize.toast("This is our ScrollFire Demo!", 1500 );
    } },
    {selector: '#staggered-test', offset: 205, callback: function(el) {
      Materialize.toast("Please continue scrolling!", 1500 );
    } },
    {selector: '#staggered-test', offset: 400, callback: function(el) {
      Materialize.showStaggeredList($(el));
    } },
    {selector: '#image-test', offset: 500, callback: function(el) {
      Materialize.fadeInImage($(el));
    } }
    ];
    Materialize.scrollFire(options);

- #### List Item

  This is a description

- #### List Item

  This is a description

- #### List Item

  This is a description

- #### List Item

  This is a description

- #### List Item

  This is a description

add

- help_outline
- widgets
- today
- mail_outline