materialize-css/jade/scrollFire.jade

Builds Materialize distribution packages

- var no_nav = false
- var page = "ScrollFire"

doctype html
html(lang="en")
  head
    include _head.jade
  body
    include _navbar.jade
    main
      include page-contents/scrollfire_content.html
    include _footer.html
    include _scripts.html
    //- Scrollfire Script
    script(type='text/javascript').
      var options = [
        {selector: '#staggered-test', offset: 50, callback: function(el) {
          Materialize.toast("This is our ScrollFire Demo!", 1500);
          $("#call-1").velocity({ backgroundColor: "#333", color: "#ef5350" }, {duration: 500});
        } },
        {selector: '#staggered-test', offset: 205, callback: function(el) {
          Materialize.toast("Please continue scrolling!", 1500);
          $("#call-2").velocity({ backgroundColor: "#333", color: "#ef5350" }, {duration: 500});
        } },
        {selector: '#staggered-test', offset: 500, callback: function(el) {
          Materialize.showStaggeredList($(el));
          $("#call-3").velocity({ backgroundColor: "#333", color: "#ef5350" }, {duration: 500});
        } },
        {selector: '#image-test', offset: 500, callback: function(el) {
          Materialize.fadeInImage($(el));
          $("#call-4").velocity({ backgroundColor: "#333", color: "#ef5350" }, {duration: 500});
        } }
      ];
      Materialize.scrollFire(options);