Need to dynamically-generate a "sticky note" text

Question

Working on a website that has an image of a sticky note which will change text somewhat frequently (every month or so) as new "todo" items are created on it.

Font I'm currently using is not Web Safe and the text is slightly angled to match the skew of the sticky note as well.

Now I'm a pragmatist, and in situations like this I would normally cede defeat and opt for something more CSS/HTML practical. But no more!

I'm falling a bit behind on what's going on with HTML5, CSS3, PNG graphics, Flash (ugh), and/or any other rich visuals. I'm decent with PHP/CSS/JS (jquery), have dabbled in Flash/actionscript too.

My question is: what tools/method should I be looking at here?

EDIT: I've switched to Comic Sans MS/Cursive -- pragmatism is fighting back furiously.

Answer 1

JQuery Sticky note plugin

Answer 2

Since you'll only be changing content once a month, and because the text is at an angle, Id probably go with a Flash solution, with a little css absolute positioning. The whole angled text thing is really what throws a wrench into any practical solution.

Answer 3

Check out: Cufon and this Cufon tutorial.

Answer 4

For the skewed/angled text, I'm going to use this method. Thanks to all for the great tips. http://someguynameddylan.com/lab/transform-origin-in-internet-explorer.php