Pull to reload — обновление страницы на JavaScript: «потяните, чтобы перезагрузить»

pull-to-reload.js – это плагин JavaScript, который позволяет реализовать для WEB`а перезагрузки страницы современным методом: тяните вниз и обновляйте страницу.

Такое представление можно увидеть в мобильных приложениях на смартфонах. Не редки и случаи, когда веб-сайты используют тот же алгоритм. Плагин pull-to-reload.js поможет Вам с легкостью реализовать похожую модель. Отличный элемент для пользовательского интерфейса.

Пример работы сценария:

Библиотека имеет гибкую настройку. Чтобы применить данный плагин на своем проекте, Вам достаточно подключить файл скрипта и указать параметры:

$(document).ready(function(){
    var ptr = new PullToReload({ 
        'callback-loading': function(){
            setTimeout(function(){
                ptr.loadingEnd();
            }, 5000);
        }
    });
});

Ниже приведены доступные опции плагина:

this.opts = {
        'refresh-element': 'ptr', //Required
        'content-element': 'content', //Required
        'border-height': 1,
        'height': 80,
        'font-size': '30px',
        'threshold': 20,
        'pre-content': '...',
        'loading-content': 'Loading...',
        'callback-loading': function(){ setTimeout(function(){ self.loadingEnd(); }, 1000); } //Required
    }

Как видно из кода выше, все очень просто и удобно настраивается и используется. Скачать файлы плагина JavaScript можно по ссылке выше. Удачи!