Pull To Refresh Library With Pure JavaScript – Pull.js

Category: Javascript , Loading | March 7, 2019
Views Total:2,390 views
Official Page:Go to website
Last Update:March 7, 2019


Pull To Refresh Library With Pure JavaScript – Pull.js


Pull.js is a tiny and zero-dependency JavaScript library that provides pull to refresh & pull to load functionality for your mobile webpages.

How to use it:

Install Pull.js library via NPM.

$ npm save --save pulljs

Import the Pull.js to your project.

import Pull from 'pulljs';

Initialize & setup the Pull.js library.

  // parameters here

All possible parameters with default values.

  distThreshold: 60, // in ms
  distMax: 80,
  distReload: 50,
  bodyOffset: 20,
  mainElement: 'body',
  triggerElement: 'body',
  ptrElement: '.ptr',
  classPrefix: 'ptr--',
  cssProp: 'min-height',
  containerClassName: '',
  boxClassName: '',
  contentClassName: '',
  textClassName: '',
  instructionsPullToRefresh: 'Pull down to refresh',
  instructionsReleaseToRefresh: 'Release to refresh',
  instructionsRefreshing: 'Refreshing',
  refreshTimeout: 500,
  ptrOnDesktop: false, // enable desktop mouse functionality
  onInit: () => {},
  onRefresh: () => location.reload(),
  resistanceFunction: t => Math.min(1, t / 2.5),


v0.2.0 (03/07/2019)

  • Add optional ptr functionality for desktop.

You Might Be Interested In:

Leave a Reply