forked from jeffchan/truncate.js
-
Notifications
You must be signed in to change notification settings - Fork 2
/
README
103 lines (69 loc) · 2.5 KB
/
README
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
Truncate.js
====
Fast, intelligent Javascript text truncation
Usage
-----------
Truncate.js currently depends on jQuery. There are two ways to use Truncate.js:
1) as a jQuery plugin
# Initialize and truncate.
$('#truncate_me').truncate({
lines: 2,
lineHeight: 20
});
# Update the HTML and truncate.
$('#truncate_me').truncate('update', 'new html to truncate');
# Undo the truncation.
$('#truncate_me').truncate('expand');
# Redo the truncation (uses cached HTML).
$('#truncate_me').truncate('collapse');
2) as a vanilla Javascript object
# Initialize and truncate.
var truncated = new Truncate(document.getElementById('#truncate_me'), {
lines: 2,
lineHeight: 20
});
# Update the HTML and truncate.
truncated.update('new html to truncate');
# Undo the truncation.
truncated.expand();
# Redo the truncation (uses cached HTML).
truncated.collapse();
# Check if content is truncated. (not supported as a jQuery plugin)
var isTruncated = truncated.isTruncated();
Options
-----------
lineHeight - Required. The text line height.
lines - Defaults to 1
ellipsis - Text content to add at the truncation point. Defaults to …
showMore - HTML to insert at the truncation point. Useful for a "Show More" button.
Defaults to empty string.
showLess - HTML to insert when .expand() is called. Useful for a "Show Less" button.
Defaults to empty string.
Caveats
-----------
Truncate.js does it's best to intelligently truncate through HTML. However,
there are a few cases where it fails, mostly because the text height cannot
be easily calculated.
- truncating a node with floating element
- truncating a node with descendant elements that have padding
- truncating a node with text of varying line heights
See `demo/demo.html` for examples of what works and what doesn't.
Development
-----------
It's very simple, hack on the code, ensure the lint and tests pass and submit
a pull request. Rinse and repeat.
To install the developer packages you'll need node and npm installed on your
machine. Then run:
$ npm install
To run the linter:
$ make lint
Testing
-------
To run the test suite:
$ make test
### Libraries
- [Mocha](http://visionmedia.github.com/mocha/) - Test runner, we use the `bdd` style.
- [Chai](http://chaijs.com/api/assert/) - Assertion library, we use `assert` style.
License
-------
Available under the MIT license. See LICENSE file for details.