Home > Webmasters Resources > Text-Overflow for Firefox via jQuery

Text-Overflow for Firefox via jQuery

Devon Govett is a fan of the new CSS3 property text-overflow:

There are a few CSS features that Microsoft pioneered and has had available to developers in Internet Explorer for a long time now. One of those features is the text-overflow property, which is now in CSS3 and has implementations in Safari, and Opera. Firefox still does not support this feature, but I have heard that it will in Firefox 3.1.

Here is a rundown of what the property does. When text overflows an element’s box, the text-overflow property helps leave a visual hint to the user that there is more text. When a value of ellipsis is used, three dots will be shown before the text is clipped by overflow: hidden.

Lorem ipsum dolor sit amet, c…

I wanted to be able to use this feature in all browsers, so I wrote a small jQuery plugin in order to support Firefox. To use, just call ellipsis() on a jQuery object. For example:

$("span").ellipsis();

Categories: Webmasters Resources Tags: , ,
  1. No comments yet.
  1. No trackbacks yet.