summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorJed Foster <jed@jedfoster.com>2014-02-09 12:59:54 -0800
committerJed Foster <jed@jedfoster.com>2014-02-09 12:59:54 -0800
commitce591e2f0b849dcb48a5c165a96d935a08ae94e1 (patch)
tree4e1c9e9961ff8e39f9c7ef0fc7bdbf730b9b48af
parentdb4c5f4b613e6e9a0a1b25d14263c41223073492 (diff)
parentf3df04f90007d2018d5c9546140bf4324a83a053 (diff)
downloadReadmore.js-ce591e2f0b849dcb48a5c165a96d935a08ae94e1.zip
Readmore.js-ce591e2f0b849dcb48a5c165a96d935a08ae94e1.tar.gz
Readmore.js-ce591e2f0b849dcb48a5c165a96d935a08ae94e1.tar.bz2
Merge branch 'jackshakes-master'
-rw-r--r--README.md1
-rw-r--r--demo.html3
-rw-r--r--readmore.js7
-rw-r--r--readmore.min.js10
4 files changed, 13 insertions, 8 deletions
diff --git a/README.md b/README.md
index aad5a7a..325c663 100644
--- a/README.md
+++ b/README.md
@@ -22,6 +22,7 @@ Yes, it's that simple. You can change the speed of the animation, the height of
* `speed: 100` (in milliseconds)
* `maxHeight: 200` (in pixels)
+* `heightMargin: 16` (in pixels, avoids collapsing blocks that are only slightly larger than `maxHeight`)
* `moreLink: '<a href="#">Read more</a>'`
* `lessLink: '<a href="#">Close</a>'`
* `embedCSS: true` (insert required CSS dynamically, set this to `false` if you include the necessary CSS in a stylesheet)
diff --git a/demo.html b/demo.html
index c7b2cea..948b369 100644
--- a/demo.html
+++ b/demo.html
@@ -54,7 +54,8 @@
<ul>
<li><code>speed: 100</code> (in milliseconds)</li>
- <li><code>maxHeight: 200</code> (in pixels)</li>
+ <li><code>maxHeight: 200</code> (in pixels)</li>
+ <li><code>heightMargin: 16</code> (in pixels, avoids collapsing blocks that are only slightly larger than <code>maxHeight</code>)</li>
<li><code>moreLink: '&lt;a href="#"&gt;Read more&lt;/a&gt;'</code></li>
<li><code>lessLink: '&lt;a href="#"&gt;Close&lt;/a&gt;'</code></li>
<li><code>embedCSS: true</code> (insert required CSS dynamically, set this to <code>false</code> if you include the necessary CSS in a stylesheet)</li>
diff --git a/readmore.js b/readmore.js
index 0bf2119..1702369 100644
--- a/readmore.js
+++ b/readmore.js
@@ -11,6 +11,7 @@
defaults = {
speed: 100,
maxHeight: 200,
+ heightMargin: 16,
moreLink: '<a href="#">Read More</a>',
lessLink: '<a href="#">Close</a>',
embedCSS: true,
@@ -29,6 +30,7 @@
this.options = $.extend( {}, defaults, options);
$(this.element).data('max-height', this.options.maxHeight);
+ $(this.element).data('height-margin', this.options.heightMargin);
delete(this.options.maxHeight);
@@ -63,7 +65,8 @@
$(this.element).each(function() {
var current = $(this),
- maxHeight = (current.css('max-height').replace(/[^-\d\.]/g, '') > current.data('max-height')) ? current.css('max-height').replace(/[^-\d\.]/g, '') : current.data('max-height');
+ maxHeight = (current.css('max-height').replace(/[^-\d\.]/g, '') > current.data('max-height')) ? current.css('max-height').replace(/[^-\d\.]/g, '') : current.data('max-height'),
+ hightMargin = current.data('height-margin');
current.addClass('readmore-js-section');
@@ -73,7 +76,7 @@
current.data("boxHeight", current.outerHeight(true));
- if(current.outerHeight(true) < maxHeight) {
+ if(current.outerHeight(true) <= maxHeight + hightMargin) {
// The block is shorter than the limit, so there's no need to truncate it.
return true;
}
diff --git a/readmore.min.js b/readmore.min.js
index f5157b2..1f485f9 100644
--- a/readmore.min.js
+++ b/readmore.min.js
@@ -1,5 +1,5 @@
-(function(d){function g(c,a){this.element=c;this.options=d.extend({},h,a);d(this.element).data("max-height",this.options.maxHeight);delete this.options.maxHeight;if(this.options.embedCSS&&!k){var b=".readmore-js-toggle, .readmore-js-section { "+this.options.sectionCSS+" } .readmore-js-section { overflow: hidden; }",e=document.createElement("style");e.type="text/css";e.styleSheet?e.styleSheet.cssText=b:e.appendChild(document.createTextNode(b));document.getElementsByTagName("head")[0].appendChild(e);
-k=!0}this._defaults=h;this._name=f;this.init()}var f="readmore",h={speed:100,maxHeight:200,moreLink:'<a href="#">Read More</a>',lessLink:'<a href="#">Close</a>',embedCSS:!0,sectionCSS:"display: block; width: 100%;",beforeToggle:function(){},afterToggle:function(){}},k=!1;g.prototype={init:function(){var c=this;d(this.element).each(function(){var a=d(this),b=a.css("max-height").replace(/[^-\d\.]/g,"")>a.data("max-height")?a.css("max-height").replace(/[^-\d\.]/g,""):a.data("max-height");a.addClass("readmore-js-section");
-"none"!=a.css("max-height")&&a.css("max-height","none");a.data("boxHeight",a.outerHeight(!0));if(a.outerHeight(!0)<b)return!0;a.after(d(c.options.moreLink).on("click",function(b){c.toggleSlider(this,a,b)}).addClass("readmore-js-toggle"));a.data("sliderHeight",b);a.css({height:b})})},toggleSlider:function(c,a,b){b.preventDefault();var e=this,f=newLink="";b=!1;f=d(a).data("sliderHeight");d(a).height()==f?(f=d(a).data().boxHeight+"px",newLink="lessLink",b=!0):newLink="moreLink";e.options.beforeToggle(c,
-a,b);d(a).animate({height:f},{duration:e.options.speed});d(c).replaceWith(d(e.options[newLink]).on("click",function(b){e.toggleSlider(this,a,b)}).addClass("readmore-js-toggle"));e.options.afterToggle(c,a,b)}};d.fn[f]=function(c){var a=arguments;if(void 0===c||"object"===typeof c)return this.each(function(){d.data(this,"plugin_"+f)||d.data(this,"plugin_"+f,new g(this,c))});if("string"===typeof c&&"_"!==c[0]&&"init"!==c)return this.each(function(){var b=d.data(this,"plugin_"+f);b instanceof g&&"function"===
-typeof b[c]&&b[c].apply(b,Array.prototype.slice.call(a,1))})}})(jQuery);
+(function(d){function g(b,a){this.element=b;this.options=d.extend({},h,a);d(this.element).data("max-height",this.options.maxHeight);d(this.element).data("height-margin",this.options.heightMargin);delete this.options.maxHeight;if(this.options.embedCSS&&!k){var c=".readmore-js-toggle, .readmore-js-section { "+this.options.sectionCSS+" } .readmore-js-section { overflow: hidden; }",e=document.createElement("style");e.type="text/css";e.styleSheet?e.styleSheet.cssText=c:e.appendChild(document.createTextNode(c));
+document.getElementsByTagName("head")[0].appendChild(e);k=!0}this._defaults=h;this._name=f;this.init()}var f="readmore",h={speed:100,maxHeight:200,heightMargin:16,moreLink:'<a href="#">Read More</a>',lessLink:'<a href="#">Close</a>',embedCSS:!0,sectionCSS:"display: block; width: 100%;",startOpen:!1,beforeToggle:function(){},afterToggle:function(){}},k=!1;g.prototype={init:function(){var b=this;d(this.element).each(function(){var a=d(this),c=a.css("max-height").replace(/[^-\d\.]/g,"")>a.data("max-height")?
+a.css("max-height").replace(/[^-\d\.]/g,""):a.data("max-height"),e=a.data("height-margin");a.addClass("readmore-js-section");"none"!=a.css("max-height")&&a.css("max-height","none");a.data("boxHeight",a.outerHeight(!0));if(a.outerHeight(!0)<=c+e)return!0;a.data("sliderHeight",c);a.after(d(b.options.startOpen?b.options.lessLink:b.options.moreLink).on("click",function(c){b.toggleSlider(this,a,c)}).addClass("readmore-js-toggle"));b.options.startOpen||a.css({height:c})})},toggleSlider:function(b,a,c){c.preventDefault();
+var e=this,f=newLink="";c=!1;f=d(a).data("sliderHeight");d(a).height()==f?(f=d(a).data().boxHeight+"px",newLink="lessLink",c=!0):newLink="moreLink";e.options.beforeToggle(b,a,c);d(a).animate({height:f},{duration:e.options.speed});d(b).replaceWith(d(e.options[newLink]).on("click",function(b){e.toggleSlider(this,a,b)}).addClass("readmore-js-toggle"));e.options.afterToggle(b,a,c)}};d.fn[f]=function(b){var a=arguments;if(void 0===b||"object"===typeof b)return this.each(function(){d.data(this,"plugin_"+
+f)||d.data(this,"plugin_"+f,new g(this,b))});if("string"===typeof b&&"_"!==b[0]&&"init"!==b)return this.each(function(){var c=d.data(this,"plugin_"+f);c instanceof g&&"function"===typeof c[b]&&c[b].apply(c,Array.prototype.slice.call(a,1))})}})(jQuery);