What is Materialize Pushpin?

Material Design - Interview Questions

Material Design Pushpin means fixed positioning plugin. Use this to pin elements to your page during specific scroll ranges. You can check out the following example.

Demo Code :

$('.pushpin-demo-nav').each(function() {
    var $this = $(this);
    var $target = $('#' + $(this).attr('data-target'));
    $this.pushpin({
      top: $target.offset().top,
      bottom: $target.offset().top + $target.outerHeight() - $this.height()
    });
});

// Only necessary for window height sized blocks.
html, body, .block {
   height: 100%;
}

jQuery Plugin Initialization :

Here is a sample initialization of materialize pushpin.

$(document).ready(function(){
    $('.target').pushpin({
      top: 0,
      bottom: 1000,
      offset: 0
    });
});