Adding ellipsis using jquery if cell text exceeds

Question

I have a span tag in a table header below which is a multiline text and I want to add an ellipsis (...) If the line exceeds more than with in the cell with jQuery or JavaScript. I cannot use any CSS or jQuery plugins.

<span class="co_dcrTable_Header" style="width: auto;">Market capitalization at filing</span>

i can use jquery but not any plugins in jqyery. Trying to avoid css. I think using javscript/jquery there should be a way ? — user3496151, Jun 19 '14 at 18:31
http://stackoverflow.com/questions/536814/insert-ellipsis-into-html-tag-if-content-too-wide — Mathias Rechtzigel, Jun 19 '14 at 18:31
yeah i looked at it . Below is the modified code i have written. — user3496151, Jun 19 '14 at 18:43
@MathiasaurusRex can u look at the prob in answer and let me know the issue please ? — user3496151, Jun 19 '14 at 19:10

score 0 · Answer 1 · answered Jun 19 '14 at 18:46

            if(el.css("overflow") == "hidden")
            {
                var text = el.html();
                var t = $(this.cloneNode(true))
                .hide()
                .css('position', 'absolute')
                .css('overflow', 'visible')
                .width(el.width())
                .height('auto');

                el.after(t);

                while (text.length > 0 && (t.height() > el.height()))
                {
                    text = text.substr(0, text.length - 1);
                    t.html(text + "...");
                }

                el.html(t.html());
                t.remove();
            }

I have the above code it is not going into the while block since the condition t.height() > el.height() is failing as both heights are showing equal values . I have the span tag with the text

Adding ellipsis using jquery if cell text exceeds

1 Answers1