Hi Eitan, Unless you need the notes content to be dynamic, which might need to communicate with the server via AJAX or other means, it seems like the task is mostly Javascript work.
To use a library such as jQuery will make your Javascript task much easier. For instance, for your notes to popup, you will 'subscribe' to either the hover or click events (but probably not both) and provide 'callback' function(s) when the event happens. For the hover event you need two callbacks to handle 'mouse enter' and 'mouse leave'. Not sure why you need the original text pushed up, but typically in the case of hovering it might be easier to display an area of text 'on top of' the original text by specifying a higher z-index number, or for click event, one can use a dialog box to display the notes. As for the positions of the popup, it's not difficult to determine the absolute position of the original element and put the popup right on top of the original text via jQuery functions. For dialog boxes, there's the handy jQuery UI plugin for further help. Does this make sense? i have a website MathShifu.com to help kids practice Math which has examples for both click and hover events. You are more than welcome to take a look and see if any of those code is useful to you. Hope this helps and good luck. Cheers, Chungwen On Jun 4, 2011, at 8:40 PM, Eitan wrote: > Hi - I am working on a language-learning site and want some grammar > notes to appear above a word when hovered over or clicked. Does > anyone know how I could have the popup with the grammar notes > "squeeze" its way into the text (i.e. the text above the original > sentence automatically gets pushed up to make room for the grammar > note)? The idea is to have a natural-looking original text (no excess > space between lines), keep grammar notes as close as possible to their > referents, and not cover any text with the popups (which contain the > grammar notes). > > Thanks! > > -Eitan > > -- > SD Ruby mailing list > [email protected] > http://groups.google.com/group/sdruby -- SD Ruby mailing list [email protected] http://groups.google.com/group/sdruby
