Pull to refresh. For the web.

We love that neat little "pull to refresh" feature on our devices, but wouldn't it be awesome if it was for the web? Well, that's what Hook is here to do. We took a concept from mobile phones and tablets and made it work for the web. Try it out: Simply scroll down a bit, and then back up to the top. Bam! You've just Hooked for the first time on the web. Download it below.

Customizable. And then some.

There are 9 settings and 1 callback:

  • reloadPage: default is true, if false will reload element (note must also have reloadEl callback),
  • dynamic: default is true, if false you will need your own html,
  • textRequired: default is false, if true the dynamic text HTML will be added,
  • swipeDistance: default is 50, the amount of swipe distance on touch devices to fire reload,
  • loaderClass: default is hook-loader,
  • spinnerClass: default is hook-spinner,
  • loaderTextClass: default is hook-text,
  • loaderText: default is 'Reloading..' is only set when you set 'textRequired'
  • reloadEl: callback

Example

// No options
$('#hook').hook();

// Callback
$('#hook').hook({
  reloadPage: false,
  reloadEl: function(){
    console.log('Hello World!');
  }
});

Download

Hook.js is open sourced and ready to grow. You can find it on GitHub, so feel free to fork it and make it your very own.