[development] Javascript Tools and Backport: developer-interest modules

[Gary (Lists)]

"Farsheed" wrote:

> this would be really useful for making help tooltips, kind of like balloon
> help in the Mac OS.

Tooltips of all kinds (as well as other small CSS-able windows like this)
can be made with any one of:

    overlib.js          a Lg, Med or Mini lib for producing hover pops

    1k.js               a faboo 1k js api  <-- my fave

    psCrossbrowser.js   a nice, compact lib (but not 1k ;)

> I'd be interested in using it to make a tooltip theme for theme designers that
> pops up what phptemplate variable is responsible for each part of the page,
> and maybe shows a border when hovering over the element.

Check out a few of the replacement CSS files for Mozilla (or IE, or other)
browsers, where you can easily border all elements. By borrowing this
method, you could have a theme debug toggle (js) that switched your CSS file
from the theme's CSS to your debug.css, which would show the outlines and
such. Or switch to a specific debug.tpl.php file, with the overlib.js
attached, to do your hover pops.

This CSS trick is pretty old, and this is how the "View Rendered Source"
feature of the Firefox Web Developer plug-in works also.

But you don't need the plugin. You just need to replace your Mozilla
"user.css" file.  (Search Google for "mozilla and user.css" and you will
find loads of examples to do just what you describe. Maybe that will save
you some time, since the theme-specific stuff sounds useful.)

Good idea, Farsheed.
--
Gary