no-image

JavaScript

続きを読むボタンを実装できる「ReadMorePlugin」

ReadMorePluginは「続きを読む」、「もっと読む」、「Read More」などといったボタンを実装できるjQueryプラグインです。長文ページで全テキストを表示するのはスペース的にも余裕がないなんて時に活躍してくれますね。

ReadMorePlugin

ReadMorePlugin

デモではテキストの下に「Read More…」というボタンが設置されていて、ここをクリックすると続きの文章が表示されます。全文が表示されると先ほどの「Read More…」が「Read Less…」という文字に変化します。再度これをクリックすると最初の時のように続きのテキスト部分が非表示になります。

表示・非表示をユーザー自身がコントロールできるのが便利ですね。ブログなどで長い文章を表示させる時に、Read Moreボタンを設置したいという人は、ぜひ「ReadMorePlugin」を活用されてみてはいかがでしょうか?

オプションには、hideText、readText、isTextShown、effect、effectOption、buttonClasses、idといった項目が用意されています。ちょっとしたカスタマイズにも対応しているので、気になる人はぜひチェックしてみてください。

ReadMorePluginのライセンスはMITになります。

Alerts.cssシンプルでピュアなCSSによるアラート実装「Alerts.css」前のページ

インタラクティブな背景を実装できる「Brusher」次のページBrusher

関連記事

  1. Text Effects

    JavaScript

    テキストがカシャカシャ切り替わって表示するjQueryプラグイン「Text Effects」

    Text EffectsというjQueryプラグインを使えば、テキスト…

  2. no-image

    JavaScript

    水平スクロールができることを示唆してくれる「ScrollHint」

    ScrollHintは水平スクロールができることをポインタアイコンを使…

  3. jQuery Page

    JavaScript

    モバイルに最適なスライドやフリップを実装できる「jQuery Page」

    jQuery Pageは、スマホなどモバイルに最適なスライドやフリップ…

  4. Brusher

    JavaScript

    インタラクティブな背景を実装できる「Brusher」

    Brusherはインタラクティブな背景を実装できる軽量なJavaScr…

  5. hummingbird-popover

    JavaScript

    高速・軽量なコンテキストメニュー実装「hummingbird-popover」

    hummingbird-popoverは高速・軽量なコンテキストメニュ…

  6. no-image

    JavaScript

    プレーンなJavaScriptによるレスポンシブなLightbox「jsOnlyLightbox」

    jsOnlyLightboxは、jQueryなどを必要としないプレーン…

最近の記事

  1. ナイトロコーヒー
  2. チーズベーコンエッグバーガー
  3. ランチセットA
PAGE TOP