pull-to-reloadは、Webページ内で下へ引くだけでページをリフレッシュ（リロード）することができるスクリプトです。Webアプリケーションやシングルページのアプリケーションなどで、ユーザーに手軽にページをリロードさせたい時にはピッタリですね。
pull-to-reload
pull-to-reloadの実際のデモ動作は以下のページからチェックできます。
下に引っ張ることでページがリフレッシュされます。スマホアプリなどではよく見かける動作ですね。
リロードされている時は、画面上部に「Loading…」という文字が大きく表示されるので、現在ページが読み込まれている最中であることが瞬時に把握できると思います。
マークアップやJSの記述もシンプルで使いやすい仕様になっています。また、pull-to-reloadにはオプションもいくつか用意されています。
利用できるオプション項目は、refresh-element、content-element、border-height、height、font-size、threshold、pre-content、loading-content、callback-loadingです。
ボーダーの高さや文字の大きさなども、オプションから手軽に調整できるので、細かいカスタマイズをして使いたい人にもうれしいですね。
というわけで、スマホアプリのようにページを下に引いてリロードさせる機能を実装したいという人は、ぜひ「pull-to-reload」をチェックしてみてはいかがでしょうか？
