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で空港や駅にある掲示板のように指定した文字が切り替わっていくAirportを使ってみた

    面白いプラグインがあったので使ってみました。空港や駅にある掲示板みたい…

  2. Tendina

    JavaScript

    簡単で素早くドロップダウンメニューを実装できるjQueryプラグイン「Tendina」

    TendinaというjQueryプラグインを使えば、とても簡単で素早く…

  3. StickyStack.js

    JavaScript

    パネルにスタッキング効果を実装できるjQueryプラグイン「StickyStack.js」

    StickyStack.jsはパネルにスタッキング効果を実装することが…

  4. kissui.scrollanim

    JavaScript

    スクロールによる多彩なアニメーションを実装できる「kissui.scrollanim」

    kissui.scrollanimは、CSS3を活用したスクロールによ…

  5. Bootstrap Navbar Sidebar

    JavaScript

    サイドに固定できるナビゲーション実装「Bootstrap Navbar Sidebar」

    Bootstrap Navbar Sidebarは、サイドに固定できる…

最近の記事

  1. そそそ 明太クリームそうめん
  2. すしざんまい
  3. 蒼龍唐玉堂 特製牛バラ担々麺
  4. サーモンアボカドサラダラップとドリップ
  5. 猿田彦フレンチ

アーカイブ

PAGE TOP