ptrLight

JavaScript

モバイル用のリフレッシュインジケーターを実装できる「ptrLight」

ptrLightはモバイル用のリフレッシュインジケーターを実装することができるjQueryプラグインです。Slobodan Jovanovicのxpullをベースにしているとのこと。iOS(mobile Safari、WebView)とAndroid(Chromium/Webkit)で活用できます。

ptrLight

デモ

iPhoneなどのスマホからアクセスし、コンテンツを下に引くと画面上部にリフレッシュインジケーターが表示されます。モバイルページで、このようなインジケーターをよく見かけたことがある人は多いのではないでしょうか?

コンテンツを更新(リフレッシュ)したい時に、画面を下に引っ張るだけで簡単に更新できるので、とても操作が簡単ですね。使い方も簡単で、プラグインのファイル容量も軽量なところもうれしいポイントの1つです。

さらに、ptrLightにはオプションもいくつか用意されています。主なオプション項目は、paused、ignoreThreshold、pullThreshold、maxPullThreshold、spinnerTimeout、scrollingDom、allowPtrWhenStartedWhileScrolled、refreshなどです。

また、スピナーの幅や高さなどのセッティングは、CSSを用いて調節することができます。シンプルで軽量ながらも、オプションやCSSを用いていろいろカスタマイズできる仕様も、このプラグインの魅力といえますね。

というわけで、iOS・Androidで使えるモバイル用のリフレッシュインジケーターを実装したいという人は、ぜひ「ptrLight」をチェックしてみてください。

ptrLight

no-imageクッキーバナーを手軽に作れるjQueryプラグイン「Cookie Banner JS」前のページ

超軽量でアクセシブル・レスポンシブなLightboxを実装できる「Lity」次のページLity

関連記事

  1. JavaScript

    シンプルで軽量のレスポンシブなjQueryスライダー「ResponsiveSlides.js」を使っ…

    とてもシンプルで使いやすそうなレスポンシブのjQueryスライダー「R…

  2. Menu Droplet Animation
  3. KGallery

    JavaScript

    縦や横に配置されたサムネイルから画像を選択できるjQueryの画像ギャラリー「KGallery」

    縦や横に配置されたサムネイルから画像を選択することができるjQuery…

  4. scrollUp

    JavaScript

    スクロールしていくと先頭に戻るボタンを表示してくれるjQueryプラグイン「scrollUp」

    下へスクロールしていくと、先頭に戻るボタンを表示してくれるjQuery…

  5. jQueryでウィンドウサイズによって処理を変える

    JavaScript

    jQueryで現在のウィンドウサイズの取得と判定をして処理を変えるやり方

    jQueryで現在のウィンドウサイズの取得と判定をして処理を変えるやり…

  6. Swipebox

    JavaScript

    スマホやタブレットのスワイプにも対応したLightboxを実装できるjQueryプラグイン「Swip…

    今後かなり需要がありそうなjQueryプラグインがあったので使い方も兼…

最近の記事

  1. EOS R6
  2. EOS R5
  3. Anker PowerExpand Direct 6-in-1 USB-C PDメディアハブ

アーカイブ

PAGE TOP