detect text overflow and crop, inserting an ellipsis

text_overflow.js

var TextOverflow = {
    crop: function(elm) {
        var w = elm.width(),
        t = elm.text(),
        child;

        elm.html('<span style="overflow: hidden; white-space: nowrap">'+t+'</span>');
        child = elm.children(":first-child");
        while (t.length > 0 && child.width() > w) {
            t = t.substr(0, t.length - 1);
            child.html(t + '<span class="ellipsis">&hellip;</span>');
        }
    }
};

New Way

ScrollWidth - OffsetWidth > 0