スマホで画面下部に引っ張って更新が実装できるJSライブラリ「Pull to Refresh.js」

2017/01/26

こんにちは。
今回はスマホで画面下部に引っ張って更新が実装できるJSライブラリ「Pull to Refresh.js」です。

アプリのように画面下部に引っ張るとリロードすることができるスクリプトを紹介します。

スマホで画面下部に引っ張って更新が実装できるJSライブラリ「Pull to Refresh.js」

Pull to Refresh.js

pull-to-refresh-js

 

「Pull to Refresh.js」をダウンロードしてみよう!

https://github.com/BoxFactura/pulltorefresh.jsにアクセスして右にある「Download ZIP」のボタンをクリックしてダウンロードします。

 

「Pull to Refresh.js」を設置してみよう!

pulltorefresh.jsを/bodyの手前に読み込みます。

 

その下に下記のスクリプトを記述します。

 

デモのようにidを指定することもできますよ。

 

何となくJavaScriptを書いていた人が一歩先に進むための本
何となくJavaScriptを書いていた人が一歩先に進むための本

 

いかがでしたか。アプリでよくある機能をWebサイトに簡単に実装できますね。
以上でスマホで画面下部に引っ張って更新が実装できるJSライブラリ「Pull to Refresh.js」でした。

topへ戻る