Posts Tagged ‘styling’

Keyword highlighting in html Part Two

This is Part Two of a post about making a simple HTML input control that highlights key-words as you type them. It’s a follow-on from a post I made recently that walked through underlining text with wavy squiggles, which glossed over the trickiest part – actually updating the entered text as it is typed.

Now that Part One has covered why you might want to do this, and what some better alternatives are if you’re looking for something more sophisticated, I’m just gonna go ahead and present ALL the code and then walk through it with explanations: Read more…

Keyword highlighting in html Part One

Recently I posted about adding squiggly underlines to user-editable text in HTML.

By the end of the article we had nice squiggly lines appearing under text in a cross-browser way, falling back to a double underline if image borders weren’t supported. The “small” exercise left for the reader was to handle updating the text on the fly and restoring the caret position. I didn’t want to let on how much of a pain in the arse that can be! But since it is such a pain in the arse, I’m going to share the trials and tribulations with you, and by the end of this post we should have a nice working solution.

Read more…