1.0.1 • Published 8 years ago
simple-expand v1.0.1
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). ReturnssimpleExpand. - 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)