Minimal Pull To Refresh Plugin With jQuery - pullToRefresh.js
| File Size: | 5.41 KB | 
|---|---|
| Views Total: | 2356 | 
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website | 
| License: | MIT | 
A lightweight and easy-to-use jQuery pull to refresh plugin which can be used to load more content by dragging the screen downward with the finger.
How to use it:
1. Include the Font Awesome for the animated loading indicator when pull to refresh.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
2. Include jQuery library and the jQuery pullToRefresh.js script on the page.
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" 
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" 
        crossorigin="anonymous">
</script>
<script src="js/pullToRefresh.js"></script>
3. Call the main function pullToRefresh on the container and specify the callback function which will be triggered after user pulls the content.
<div id="main"> <div id="header">HEADER</div> <div id="container">Container</div> </div>
$('#container').pullToRefresh({
  refreshCallback: function(){
    // can be used to load more content
    setTimeout(function(){
     $('#container').pullToRefresh().stop();
    },5000)
  }
});
This awesome jQuery plugin is developed by lcapps-es. For more Advanced Usages, please check the demo page or visit the official website.








