» Table Of Contents
Event Tooltips
Section 3.2.8
Adding a tooltip is great way way to display extra information to your visitors. It's also a good way to make an event stand out against a busy calendar.
There are two types of tooltips. Type one is the standard "title" attribute tooltip of a div tag. This is a very plain tooltip. You cannot control the colors, font sizes, use html or determine how long it is visible.
The second type is a div tooltip. This is a tooltip added by the third party javascript library overlib.js. With this type of tooltip, you control the colors and fonts in the scrptcal.css. You can use html. The tooltip is visible as long as the mouse hovers over the event.
The type is controlled by the tooltipType property. The default type is type two, the overlib.js tooltip.
You can specify exactly what you want to appear in the tooltip of every event by using the 7th argument of the fscEvent call. This is the tooltip argument. If you use type 2 tooltips, you can put html in the text argument and it will be used on the tooltips. If you use type 1, use only plain text in the arugment.
When you use type 2 tooltips, you can configure the events to reuse the event text in the tooltip when the tooltip argument is empty. Every event will have a tooltip. Events with a tooltip argument will use the tooltip argument html. Events without tooltip arguments will use the the event text for the tooltip. You can control this the property tooltipUseEventText which is a boolean value.
You can control the fonts and colors of the type 2 tooltip in the scrptcal.css. There are classes beginning with "scTooltip" that are used to configure the tooltip div. The .scDivTooltipBackground and .scDivTooltipForeground are table elements. The .scDivTooltipFont is the inner div of the tooltip. This class is where you should put most of your styles.
The overLIB is a JavaScript library created to enhance websites with small popup information boxes (like tooltips) to help visitors around your website. It can be used to provide the user with information about what will happen when they click on a link as well as navigational help. Not to mention that it looks cool, is stable, and has an active developer community to boot!
The overlib.js homepage http://www.bosrup.com/web/overlib/
» Table Of Contents