December 22, 2004

11:04 AM

CSSPopupFilter. I adore parenthetical comments, but they clutter up my writing, so in one of my projects, I pulled them out as endnotes. Then I discovered a clever way of doing them as css popups. But am I happy? No. [mi]
posted by Karmakaze to (10 comments total)

Yes, I'm linking to my actual pages for this. I am aware I am a vastly inferior amateur coder, etc. I'm just looking for stylistic advice about the parenthetical comments here.

With the comments pulled into a separate endnotes file, it looks like this; with the css notes, it looks like this. (In either case, there's an example in the second header "What's with the little red dots?">. I didn't like the endnotes because it requires the reader to go to another page and come back. With the css popups though, some of the comments are long enough they don't fit nicely on the screen. They also kind of look awful if you view the page with css turned off, because the coding requires them to be marked up as links. I'm vaguely aware that javascript could be applied here but (a) I don't know any javascript and (b) I think I'd rather avoid scripting in general anyway.

Basically I like the idea of having the parenthetical remarks as popups (in fact, that's how I wanted them when I first made the site years ago, but I could not figure out how to do them). I just wonder if there's a more elegant or appropriate way to achieve the effect.
posted by Karmakaze at 11:06 AM on December 22, 2004

why not use the nice titles effect that metafilter (and myself) uses.
posted by puke & cry at 11:11 AM on December 22, 2004

Primarily because I don't know any JavaScript, and nice titles does use a little scripting.

I guess I am just a coward at heart.
posted by Karmakaze at 11:14 AM on December 22, 2004

true, it does use a little javascript, but you don't have to mess with it. All you have to do to customize it is tinker with the included stylesheet. Still might be a little work for you though.
posted by puke & cry at 11:22 AM on December 22, 2004

there was a link posted somewhere (here?) discussing this problem. i think.
[searches]
here - apparently from PrinceValium (says my notes).
posted by andrew cooke at 11:38 AM on December 22, 2004

ah, further discussion.
posted by andrew cooke at 11:39 AM on December 22, 2004

Do you know if there's a length limit on those? I know some browsers will only display a certain amount of titles in the "tooltips" type box and some of my parentheticals are a bit long.
posted by Karmakaze at 11:40 AM on December 22, 2004

If you aren't going to use the "nicetitles" trick (which is pretty nifty), the way you are doing it gives you the most flexibility. You could take the commentary out of the A tag, but in IE, hovering only works on the A tag You could just mark it up like this:
<a title="this is a digression">This is a statement</a>
and rely on the tooltip effect that most browsers use for title tags, but that's much more restrictive.
posted by adamrice at 11:41 AM on December 22, 2004

I personally like overlib which supposedly has some issues with Opera, but I haven't noticed any issues in the other big browsers. It's easy to configure and use.
posted by lynda at 11:49 AM on December 22, 2004

I fiddled with pop-ups here (the first entry only; click on the dotted grey underlined "like this"), and am pretty pleased. They use some javascript, but you can copy it straight out.
posted by claxton6 at 12:14 PM on December 22, 2004