1.0.1 • Published 6 years ago

simple-expand v1.0.1

Weekly downloads
5
License
MIT
Repository
github
Last release
6 years ago

SimpleExpand.js

Simple jQuery plugin to hide/reveal content, e.g. a 'Show More' button.

Requirements: jQuery 1.3+

Features

  • Lightweight (<2KB) and efficient
  • Simple and easy to use
  • Customisable speed and easing (supports jQuery UI)

Usage

Add a simpleExpand class to any element to be hidden, and call simpleExpand.expand({your-element}) to expand or shrink it.

HTML:

<div id="example" class="simpleExpand">Anything here will get hidden until expanded.</div>

JS:

simpleExpand.init().expand($('#example')[0]);
  • simpleExpand.init(): Initialise the plugin, Returns simpleExpand.
  • simpleExpand.expand(element, callback): Expand or shrink this non-jQuery element. Returns simpleExpand. .. **callback(element, expand-type*)**: Passes the (jQuery) element called, and "expand" or "shrink" based on the action.
  • simpleExpand.settings(settings): override default settings with an object (see below for detail). Returns simpleExpand.
  • simpleExpand.isExpanded(element): returns true or false depending on whether that element is expanded.

Settings

These can be passed in as a object to simpleExpand.settings().

speed

Type: Number (ms), Default: 400

How long it will take for a letter to be typed.

easing

Type: String, Default: "swing"

A jQuery easing function to use for the expanding/shrinking animation.

Examples

The most basic usage, with default settings: Basic Usage (CodePen)

Changing the settings: Basic Usage (CodePen)