Skip to content

Commit

Permalink
Update to v1.2.0
Browse files Browse the repository at this point in the history
  • Loading branch information
Tom Doan committed Dec 29, 2015
1 parent 065fcfe commit c8de3f2
Show file tree
Hide file tree
Showing 3 changed files with 9 additions and 9 deletions.
14 changes: 7 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,26 +1,26 @@
# Scalem JS

Scalem, short for __scale elements__ or slang for __scale 'em__, is a light-weight responsive text jQuery plugin inspired by [FlowType](http://simplefocus.com/flowtype/). Use it to "liquify" elements on your website so that they scale relative to the width of their parent element or, optionally, any element you specify (see Options below). Scalem is not just limited to text size—it can be used to scale any CSS style that takes a numeric unit such as px, em, or %.
Scalem, short for __scale elements__ or slang for __scale 'em__, is a light-weight responsive text jQuery plugin inspired by [FlowType](http://simplefocus.com/flowtype/). Use it to "liquify" elements on your website so that they scale relative to the width of their parent element or, optionally, any element you specify (see Options below). Scalem is not just limited to text size—it can be used to scale any CSS style that takes a numeric unit such as `px`, `em`, or `%`.

### [See a demo »](http://thdoan.github.io/scalem/demo.html)

## Options

Options can be passed via data attributes or JavaScript (see Usage below). For data attributes, append the option name after "data-scale-", for example `data-scale-ratio="1"`.
Options can be passed via data attributes or JavaScript (see Usage below). For data attributes, append the option name after "data-scale-", for example `data-scale-ratio="0.5"`.

Name | Type | Default | Description
----------- | ------ | ------- | -----------
`ratio` | number | 0.5 | Scale ratio, where 1 scales the element to 100% the width of the reference element.
`ratio` | number | 1 | Scale ratio, where 1 scales the element to 100% the width of the reference element.
`reference` | string | parent | Selector to the reference element (text will scale relative to this element's width).
`styles` | string | '' | Space-separated list of CSS properties to scale in addition to font-size.
`styles` | string | '' | Space-separated list of CSS properties to scale in addition to `font-size`.


## Usage

```html
<body>
<h1>Scalable Heading</h1>
<p id="txt" data-scale-ratio=".25">
<p id="txt" data-scale-ratio="0.25">
Scalable Text
<p>
<p>
Expand All @@ -33,10 +33,10 @@ $(document).ready(function() {
$('h1').scalem();
// Scale text to 25% of the document's width using data attribute
$('#txt').scalem();
// Scale button to 100% the width of the <h1>, while also keeping its
// Scale button to 50% the width of the <h1>, while also keeping its
// border ratio and width proportionate, by passing object properties
$('.btn').scalem({
ratio: 1,
ratio: 0.5,
reference: 'h1',
styles: 'border-radius border-width'
});
Expand Down
2 changes: 1 addition & 1 deletion bower.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "scalem",
"description": "A lightweight jQuery plugin to make any element scalable (responsive).",
"version": "1.1.0",
"version": "1.2.0",
"main": "dist/jquery.scalem.js",
"license": "MIT",
"ignore": [
Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "scalem",
"version": "1.1.0",
"version": "1.2.0",
"description": "A lightweight jQuery plugin to make any element scalable (responsive).",
"keywords": [
"jquery-plugin",
Expand Down

0 comments on commit c8de3f2

Please sign in to comment.