Skip to content

JQuery plugin to show the first n paragraphs in a container allowing to toggle visibility of the hidden ones.

License

Notifications You must be signed in to change notification settings

manuca/hide_paragraphs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Hide Paragraphs

A very simple JQuery plugin that hides paragraphs that you don't want visible at first glance. It is very useful for example when you only want to show the first n paragraphs of a long text. The plugin automatically adds buttons at the end of the truncated paragraphs to toggle the concealed text visibility.

Demo

Demo

Installation

  • Include hide_paragraphs.js in your HTML headers after JQuery.
  • You are done

Usage

$("container selector").hideParagraphs();

by default it show just the first paragraph.

or passing an options object (see options below):

$("container selector").hideParagraphs(options);

Assumptions

  • The plugin assumes there exists a container that contains several paragraphs as chlildren, please look at test.html for an example.
  • The truncation occurs currently only at paragraph borders please take a look at jTruncate if you need to truncate at the paragraph level (show just n characters of a paragraph).

Default options

The show key is the number of paragraph you need to be visible. transition_duration is passed as is to JQuerys show() and hide() functions.

{show: 1, show_text: "Show more", hide_text: "Hide", transition_duration: 400, link_class: "hp-links"}

For example to show 3 paragraphs:

$("container selector").hideParagraphs({show: 3});

About

JQuery plugin to show the first n paragraphs in a container allowing to toggle visibility of the hidden ones.

Resources

License

Stars

Watchers

Forks

Packages

No packages published