BayZT demonstration

This is an example of a note in a different style

This is the third note.

This is quite a long note, intended to demonstrate the use of the 'overflow' CSS property.
(Notice: it doesn't work as supposed under Internet Explorer, because Internet Explorer is a bugbag.
Why don't you download a real browser instead ?)

Here's a link to my website,
here's one to Creative Commons,
and here's one to MoveOn.org .

Yet an other
alternate style

Pronounce: Bay-ZeeTee

T'habites Baisy-Thy ?

Not My Fucking Problem

Move the mouse hereon to display the attached note, then hereon to display another one. Of course the same note can be used at different places, while being defined only once.

It is also possible to define alternate styles for certain notes. There can be as many styles as you wish.

So you can now just edit index.php and bay-zt.css and see how it works. It think it is pretty simple. You don't need to edit the actual source code, bay-zt.php: just include it on your page and define your notes there, as shown in the example index.php. The CSS sheet allows you to define the style(s) for the noteboxes and the triggers (the triggers are here grey and underlined, but some alternate trigger styles can be defined too).

Almost all CSS properties can be used for noteboxes. That means, all of them, except: visibility, position, display, left, right, top, bottom and z-index, which are reserved for the script bay-zt.php. And, of course, except those which it would be absurd to use, but that's up to you ;-).

Absolutely all CSS properties can be used for the trigger. Moreover, the trigger can be an image:

, and a note can be an image too. Or, rather, an image. Of course, it may contain links.

The content of a notebox can be selected, and the selection stays available (for copying, ...) even when the note has disappeared (provided that you haven't selected something else meanwhile, of course...).

The PHP source is called Bay-ZT,
its present version is v0.1,
and it is public domain.

At least, it is public domain for civilized countries (that is, countries which don't apply software patents). For the others, I don't know, and honestly, it is NMFP.

Note for advanced developers:
If you look at the output HTML script, you will notice that the trigger tags are sometimes neatly indented, and sometimes indent gets an awful mess. This is to illustrate the argument indent that you can pass to the functions openTriggerTag and closeTriggerTag. It expresses, in number of space-characters, the indent of your script at that point. It is not an absolute necessity, but it makes the html cleaner. You can also pass that argument to the class constructor for DIV definitions at the beginning of the body. All arguments must always be grouped in an array, even when there's only one of them.
Also: the notebox's javascript ID is automaticly generated unless you pass the argument 'id' to the constructor. Noteboxes are basically DIVs, and you might want to control them with your own IDs.