document.write('<link rel="stylesheet" href="http://www.highlightmycode.com/css/embedded.css" />');
document.write('<link rel="stylesheet" href="http://www.highlightmycode.com/css/themes/default.css" />');
document.write('<div class="ht_code"><div class="ht_code_meta ht_code_meta_default"><a href="http://www.highlightmycode.com/source/htsnip48ee65e1c34f1">View Raw Source</a> | Highlithing By: <a href="http://www.highlightmycode.com">HighlitghtMyCode</a></div><pre class="ht_code_default"><span class="co1">//TextLimiter by Jean-Nicolas Jolivet</span>\n<span class="co1">//Copyright (c) 2008 http://www.silverscripting.com</span>\n<span class="co1">//MIT License:  http://www.opensource.org/licenses/mit-license.php</span>\n&nbsp;\n<span class="kw2">var</span> TextLimiter <span class="sy0">=</span> <span class="kw2">function</span> <span class="br0">&#40;</span>el<span class="sy0">,</span> options<span class="br0">&#41;</span> <span class="br0">&#123;</span>\n    <span class="kw1">this</span>.<span class="me1">message</span> <span class="sy0">=</span> options.<span class="me1">message</span> <span class="sy0">||</span> <span class="st0">&quot; chars left&quot;</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">el</span> <span class="sy0">=</span> <span class="br0">&#40;</span><span class="kw1">typeof</span> el <span class="sy0">===</span> <span class="st0">&#39;string&#39;</span><span class="br0">&#41;</span> <span class="sy0">?</span> document.<span class="me1">getElementById</span><span class="br0">&#40;</span>el<span class="br0">&#41;</span> <span class="sy0">:</span> el<span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">charLimit</span> <span class="sy0">=</span> options.<span class="me1">charLimit</span> <span class="sy0">||</span> <span class="nu0">100</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">interval</span> <span class="sy0">=</span> options.<span class="me1">interval</span> <span class="sy0">||</span> <span class="nu0">200</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">addLineBreak</span> <span class="sy0">=</span> options.<span class="me1">addLineBreak</span> <span class="sy0">||</span> <span class="kw2">true</span><span class="sy0">;</span>\n&nbsp;\n    <span class="kw1">this</span>.<span class="me1">buildElements</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="sy0">;</span>\n&nbsp;\n<span class="br0">&#125;</span><span class="sy0">;</span>\n&nbsp;\nTextLimiter.<span class="me1">prototype</span>.<span class="me1">buildElements</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n    <span class="kw2">var</span> parentEl <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">parentNode</span><span class="sy0">;</span>\n    <span class="kw2">var</span> that <span class="sy0">=</span> <span class="kw1">this</span><span class="sy0">;</span>\n&nbsp;\n    <span class="kw1">this</span>.<span class="me1">charCountEl</span> <span class="sy0">=</span> document.<span class="me1">createElement</span><span class="br0">&#40;</span><span class="st0">&#39;span&#39;</span><span class="br0">&#41;</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">charCountEl</span>.<span class="me1">className</span> <span class="sy0">=</span> <span class="st0">&#39;textlimiter&#39;</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">charCountEl</span>.<span class="me1">innerHTML</span> <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">charLimit</span> <span class="sy0">+</span> <span class="kw1">this</span>.<span class="me1">message</span><span class="sy0">;</span>\n    <span class="kw1">if</span><span class="br0">&#40;</span><span class="kw1">this</span>.<span class="me1">addLineBreak</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n        <span class="kw2">var</span> lineBreak <span class="sy0">=</span> document.<span class="me1">createElement</span><span class="br0">&#40;</span><span class="st0">&#39;br&#39;</span><span class="br0">&#41;</span><span class="sy0">;</span>\n        parentEl.<span class="me1">insertBefore</span><span class="br0">&#40;</span>lineBreak<span class="sy0">,</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">nextSibling</span><span class="br0">&#41;</span><span class="sy0">;</span>\n        parentEl.<span class="me1">insertBefore</span><span class="br0">&#40;</span><span class="kw1">this</span>.<span class="me1">charCountEl</span><span class="sy0">,</span> lineBreak.<span class="me1">nextSibling</span><span class="br0">&#41;</span><span class="sy0">;</span>\n    <span class="br0">&#125;</span>\n    <span class="kw1">else</span> <span class="br0">&#123;</span>\n        parentEl.<span class="me1">insertBefore</span><span class="br0">&#40;</span><span class="kw1">this</span>.<span class="me1">charCountEl</span><span class="sy0">,</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">nextSibling</span><span class="br0">&#41;</span><span class="sy0">;</span>\n    <span class="br0">&#125;</span>\n    <span class="kw1">this</span>.<span class="me1">oldCharCount</span> <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span>.<span class="me1">length</span><span class="sy0">;</span>\n    <span class="kw1">this</span>.<span class="me1">el</span>.<span class="kw3">onfocus</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n        that.<span class="me1">intervalTimer</span> <span class="sy0">=</span> setInterval<span class="br0">&#40;</span><span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="br0">&#123;</span>that.<span class="me1">dispatchChangeEvent</span><span class="br0">&#40;</span><span class="br0">&#41;</span><span class="sy0">;</span><span class="br0">&#125;</span><span class="sy0">,</span> that.<span class="me1">interval</span><span class="br0">&#41;</span><span class="sy0">;</span>\n    <span class="br0">&#125;</span><span class="sy0">;</span>\n&nbsp;\n    <span class="kw1">this</span>.<span class="me1">el</span>.<span class="kw3">onblur</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n        clearTimeout<span class="br0">&#40;</span>that.<span class="me1">intervalTimer</span><span class="br0">&#41;</span><span class="sy0">;</span>\n    <span class="br0">&#125;</span><span class="sy0">;</span>\n&nbsp;\n<span class="br0">&#125;</span><span class="sy0">;</span>\n&nbsp;\nTextLimiter.<span class="me1">prototype</span>.<span class="me1">dispatchChangeEvent</span> <span class="sy0">=</span> <span class="kw2">function</span><span class="br0">&#40;</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n    <span class="kw1">if</span><span class="br0">&#40;</span><span class="kw1">this</span>.<span class="me1">oldCharCount</span> <span class="sy0">!=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span>.<span class="me1">length</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n&nbsp;\n        <span class="kw2">var</span> newCharCount <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span>.<span class="me1">length</span><span class="sy0">;</span>\n        <span class="kw2">var</span> charCnt <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">charLimit</span> <span class="sy0">-</span> newCharCount<span class="sy0">;</span>\n        <span class="kw1">if</span> <span class="br0">&#40;</span>charCnt <span class="sy0">&lt;=</span> <span class="nu0">0</span><span class="br0">&#41;</span> <span class="br0">&#123;</span>\n            <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span> <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span>.<span class="me1">substr</span><span class="br0">&#40;</span><span class="nu0">0</span><span class="sy0">,</span> <span class="kw1">this</span>.<span class="me1">charLimit</span><span class="br0">&#41;</span><span class="sy0">;</span>\n            charCnt <span class="sy0">=</span> <span class="nu0">0</span><span class="sy0">;</span>\n        <span class="br0">&#125;</span>\n        <span class="kw1">this</span>.<span class="me1">charCountEl</span>.<span class="me1">innerHTML</span> <span class="sy0">=</span> charCnt <span class="sy0">+</span> <span class="kw1">this</span>.<span class="me1">message</span><span class="sy0">;</span>\n    <span class="br0">&#125;</span>\n    <span class="kw1">this</span>.<span class="me1">oldCharCount</span> <span class="sy0">=</span> <span class="kw1">this</span>.<span class="me1">el</span>.<span class="me1">value</span>.<span class="me1">length</span><span class="sy0">;</span>\n<span class="br0">&#125;</span><span class="sy0">;</span></pre></div>');