ShowMore.js

JavaScript

長いコンテンツを折りたためるjQueryプラグイン「ShowMore.js」

ShowMore.jsは長いコンテンツを折りたたんで表示・非表示を簡単に切り替えれる機能を実装するjQueryプラグインです。「続きを読む」や「More」といったボタンを設置できるイメージです。限りあるスペースを最大限に活用したい時なんかに便利ですね。

ShowMore.js

デモ

デモでは「SHOW MORE」「SHOW ME MORE」「SHOW ME MORE CONTENT」の3つのボタンが設置されています。各ボタンをクリックすると、その上にあるテキストコンテンツの続きがその場で表示されます。

スライドアニメーションで表示・非表示をサクサクと切り替えれるのがいいですね。表示するスペースの高さに制限をかけることで、より多様な情報をユーザーに見せたい場合に便利です。

セッティング面では、minheight、buttontxtmore、buttontxtless、buttoncss、animationspeedといったオプションが用意されています。アニメーションのスピード調節もオプションから手軽にできるので、ちょっとしたカスタマイズをしたい人にも嬉しい仕様ですね。

ShowMore.js

 

simpleDialogレスポンシブ対応のシンプルなポップアップ・ダイアログを実装できる「simpleDialog」前のページ

シンプルな折りたたみ・展開やアコーディオンを実装できる「Houdini」次のページHoudini

関連記事

  1. miSlider

    JavaScript

    複数の画像を表示したりスライドしたりできるスライダー「miSlider」

    miSliderは複数の画像やスライドの表示を可能にするスライダーを実…

  2. JavaScript

    フレキシブルなjQueryプラグインのアコーディオンパネル「Flexible Slide-to-to…

    いい感じのアコーディオンがあったので試してみたところ、とてもよさげだっ…

  3. Albumize

    JavaScript

    アルバムみたいな画像コレクションのギャラリーを管理・実装できるjQueryプラグイン「Albumiz…

    Webページにある画像コレクションをアルバムのようなギャラリーに管理・…

  4. no-image

    JavaScript

    シンプルでベーシックなJavaScriptによるlightbox実装「halkaBox.js」

    halkaBox.jsは、シンプルでベーシックなJavaScriptに…

  5. hop

    JavaScript

    Webページ上の好きな場所をハイライトできる「hop」

    hopはオーバーレイされたWebページ上の好きな場所をハイライトするこ…

  6. socialShare.js

最近の記事

  1. King クリーニングティッシュ
  2. PDA-STN36S
  3. クッキー&クリーム ポップコーン
  4. マウイチップス マウイオニオン味
  5. グリーンビーントゥーバー

アーカイブ

PAGE TOP