Skip to content

24 ways to impress your friends

Tasty Text Trimmer


Comments are ordered by helpfulness, as indicated by you. Help us pick out the gems and discourage asshattery by voting on notable comments.

Got something to add? You can leave a comment below.


I did something similar with the RSS and Atom feeds for Tamworth and Lichfield College a couple of months ago. It uses the Yahoo library, but I’m definitely not as familiar with it as Drew is. The idea was to take the user interface of the Safari RSS handling, but keep the stylised branding of the college. You’ll have to view it in IE6, as Firefox2, IE7 and Safari override the defined XSLT and show their (new) found RSS handling capabilities, which is a shame. Check out the Atom feed.

David Long

Great to see the 24ways back and love the updated features (microformats, improved about the author etc.)

Like the first feature. May try it on my blog when I do the next redesign.


Justin Thorp

Drew, it is a cool UI trick but do you think that non-geek real world users would actually respond well to it? To what level do users actually think about page customization or do they just come in, get what they need, and get out again? Maybe this would be good for a Web site that you go to over and over again.


That’s an awesome interface, I’ve never seen a slider with the trim text functionality.
Ultimately useful I would think!


This function looks really sweet! It’s a good thing it’s christmas again so we can get all these very nice tips :)

I do however wonder what the real advantage of this would be over having a div-tag with the css-property overflow set to hidden and which height is adjusted to hide different portions of the article? Maybe not the height should be adjusted but rather the padding or something. Wouldn’t such a solution also work? It would need the javascript controls but wouldn’t need as much javascript as this. Only curious :)


Hi Drew,

Nice trick, works lovely and smooth – I was surprised how smooth in FF2 on Windows.

I tried to set “position: fixed” on the #slider element so that it would float above the text as you scrolled down (I gave it a background to make it stand out as well), but that must break the slider bit, because it stopped sliding.

Anyway, I’m sure with a bit more tweaking I could get it to work – cool none the less, and congrats on the first 24ways article – I look forward to the rest!

(btw, came here from seeing the link in your Twitter feed)


ps: Textile formatting isn’t working very well – I tried to wrap the “position: fixed” in @s to make it into a “code” block, and it didn’t work.

Harmen Janssen

Hey, Drew, congratulations on the first 24ways Article. And a very interesting one it is, I might add!
Keep up the good work, can’t wait for all of the other articles :)

Impress us

Be friendly / use Textile