https://github.com/tinacious/textshrinkgrow
On-page text-resizing controls for use in Accessible Web Design
https://github.com/tinacious/textshrinkgrow
a11y accessibility
Last synced: about 2 months ago
JSON representation
On-page text-resizing controls for use in Accessible Web Design
- Host: GitHub
- URL: https://github.com/tinacious/textshrinkgrow
- Owner: tinacious
- Created: 2013-06-10T19:12:33.000Z (almost 13 years ago)
- Default Branch: master
- Last Pushed: 2019-07-07T02:46:48.000Z (almost 7 years ago)
- Last Synced: 2026-01-03T10:29:41.448Z (5 months ago)
- Topics: a11y, accessibility
- Language: JavaScript
- Homepage:
- Size: 9.77 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# jQuery Shrink and Grow Text
This jQuery plugin was developed for use in Accessible Web Design for users to increase and decrease their font size using on-page controls.
In order for this to work, all of your declared font sizes need to be sized relative to the body and cannot have absolute values, i.e. use ems or percentages instead of pixels.
## Usage
### HTML
You create the buttons you want to be clicked or you can use the provided plain text styles.
```html
A
A
```
### CSS
The included CSS will make it look like this if you use the included HTML.
### jQuery
Call each function on the desired element.
```js
$(document).ready(function(){
$('.shrink-link').textShrink();
$('.grow-link').textGrow();
});
```
## Demo
To see a working demo, click [here](http://tinacious.github.io/textShrinkGrow/)
[](https://bitdeli.com/free "Bitdeli Badge")