Printable
r1 - 21 Nov 2021 - 14:41:00 - TWikiContributorYou are here: TWiki >  TWiki Web > ToolTipPlugin
ANNUNCIO: L'aggiornamento dei pacchetti ISI produce importanti cambiamenti, leggete questa nota

ToolTipPlugin

This is a plugin to generate dynamic Tool Tips in HTML + javascript (mouseover event). This tooltip is based on http://www.walterzorn.com/tooltip/tooltip_e.htm

Examples

put your mouse here, you should see a tooltip .

You can use one or more parameter to get your own and nice tool tip !.

Note that you can also I18N? chars etc :-))!')">do this and this too !.

NEW: A nice feature is to get clicable TWiki site map in ToolTip :

Parameters

All walterzorn tooltip parameters are allowed and simply passed to the javascript applet. You just don't put the this.T_ before each of them. %TOOLTIP{END}% close the URL and is mandatory.

I have added TWiki specific parameter INCLUDE to fill ToolTip with content of any TWiki topic. The syntax of INCLUDE parameter can be INCLUDE="topic" or INCLUDE="web.topic". Included topic text should only content simple TWiki or HTML datas.

name usage example
END (or empty parameter) End of url text that activate the tooltip (mandatory !). %TOOLTIP{END}%
ABOVE Places the tooltip above the mousepointer. Additionally applying the OFFSETY command allows to set the vertical distance from the mousepointer. ABOVE="true"
BGCOLOR Background color of the tooltip. BGCOLOR="#d3e3f6"
BGIMG Background image. BGIMG="images/myBgImg.jpg"
BORDERWIDTH Width of tooltip border. May be 0 to hide the border. BORDERWIDTH="3"
BORDERCOLOR Border color. BORDERCOLOR="#336699"
DELAY Tooltip shows up after the specified timeout (milliseconds). DELAY="1000"
FIX Fixes the tooltip to the co-ordinates specified. Useful, for example, if combined with the STICKY command. FIX="[200, 2400]"
FONTCOLOR Font color. FONTCOLOR="#993399"
FONTFACE Font face / family. FONTFACE="verdana,geneva,sans-serif"
FONTSIZE Font size + unit. Unit inevitably required. FONTSIZE="30px"
FONTWEIGHT Font weight. Available values: "normal" or "bold". FONTWEIGHT="bold"
LEFT Tooltip positioned on the left side of the mousepointer. LEFT="true"
OFFSETX Horizontal offset from mouse-pointer. OFFSETX="32"
OFFSETY Vertical offset from mouse-pointer. OFFSETY="32"
OPACITY Transparency of tooltip. Opacity is the opposite of transparency. Value must be a number between 0 (fully transparent) and 100 (opaque, no transparency). Not (yet) supported by Opera. OPACITY="50"
PADDING Inner spacing, i.e. the spacing between border and content, for instance text or image(s). PADDING="5"
SHADOWCOLOR Creates shadow with the specified color. Shadow width (strength) will be automatically processed to 3 (pixels) if no global shadow width setting can be found in in wz_tooltip.js, and the concerned html tag doesn"t contain a SHADOWWIDTH command. SHADOWCOLOR="#ccaacc"
SHADOWWIDTH Creates shadow with the specified width (strength). SHADOWWIDTH="6"
STATIC Like OS-based tooltips, the tooltip doesn"t follow the movements of the mouse-pointer. STATIC="true"
STICKY The tooltip stays fixed on it's initial position until another tooltip is activated, or the user clicks on the document. STICKY="true"
TEMP Specifies a time span in milliseconds after which the tooltip disappears, even if the mousepointer is still on the concerned HTML element, or if the STICKY command has been applied. Values <=0 make the tooltip behave "normally" as if no time span had been specified. TEMP="3500"
TEXTALIGN Aligns the text of both the title and the body of the tooltip. Values must be included in single quotes and can be either 'right', 'justify' or 'left', the latter being unnecessary since it is the preset default value. TEXTALIGN="right"
TITLE Title. Text in single quotes. Background color is automatically the same as the border color. TITLE="Some title"
TITLECOLOR Color of title text. TITLECOLOR="#ff6666"
WIDTH Width of tooltip. WIDTH="200"
TEXT ToolTip text.  
INCLUDE Topic containing ToolTip text (like TWiki INCLUDE feature).  

General Settings

  • One line description, shown in the TextFormattingRules topic:
    • Set SHORTDESCRIPTION = create Tool Tips for links

  • Debug plugin: (See output in data/debug.txt)
    • Set DEBUG = 0

Plugin Installation Instructions

Note: You do not need to install anything on the browser to use this plugin. The following instructions are for the administrator who installs the plugin on the server where TWiki is running.

  • Download the ZIP file from the Plugin web (see below)
  • Unzip ToolTipPlugin.zip in your twiki installation directory. Content:
    File: Description:
    data/TWiki/ToolTipPlugin.txt Plugin topic
    lib/TWiki/Plugins/ToolTipPlugin.pm Plugin Perl module
    pub/TWiki/ToolTipPlugin/ToolTipBackground.jpg sample image
    pub/TWiki/ToolTipPlugin/ToolTipPhoto.gif sample image
    pub/TWiki/ToolTipPlugin/wz_tooltip.js wz tooltip library

  • Test if the installation was successful:

The same tooltip is displayed if Plugin is installed and not:

With plugin : put your mouse here, you should see a tooltip
Without plugin : put you mouse here, you should see a tooltip .

Plugin Info

Plugin Author: TWiki:Main/PatrickNomblot
Plugin Version: 1.3
Change History:  
15 Apr 2021 TWiki:Main/SteffenPoulsen: Updated with new version of wz_tooltip.js (updated browser support), support for Dakar, cleaned up doc a bit
21 Nov 2021 TWiki:Main/PatrickNomblot: Initial version
10 Sep 2021 TWiki:Main/PatrickNomblot: tooltip text can comes from any TOPIC
29 Dec 2021 TWiki:Main/AndreUlrich: updated to wz_tooltip.js v. 3.38; added further parameters
CPAN Dependencies: none
Other Dependencies: ??
Perl Version: 5.6
Plugin Home: http://TWiki.org/cgi-bin/view/Plugins/ToolTipPlugin
Feedback: http://TWiki.org/cgi-bin/view/Plugins/ToolTipPluginDev

Related Topics: TWikiPreferences, TWikiPlugins

-- TWiki:Main/PatrickNomblot - 21 Nov 2021

 

This site is powered by the TWiki collaboration platformCopyright © by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback
Note: Please contribute updates to this topic on TWiki.org at TWiki:TWiki.ToolTipPlugin