MrNicePage Tooltips Plugin is a Joomla 1.5 native tooltip plugin with enormous flexibility. Here you will find some Demos of MNP Tooltips Plugin and also a short documentation.
You can simply use the tooltip by placing { mnp_tooltip="Tooltip Text" } around the text of your choice { /mnp_tooltip } (Without spaces). This way, the CSS-Style set in the Joomla Backend will be used.
Example: Hover the Bold Text to show the tooltip!
As I mentioned before, this is the standard CSS-Style that you can set in the Joomla Backend (The possibilities of changing the standard-style are huge!). You cannot only place plain text in the tooltip, but also HTML!
Furthermore you can give each tooltip an individual style by overriding the standard CSS-Style. Just extend the tooltip-tag the following way:
{ mnp_tooltip="Tooltip Text 2",[TITLE,'mytitle',BGCOLOR,'#ffffff'] }Text of your choice{ /mnp_tooltip } (and don't forget to remove the spaces)
Example: Hover the Bold Text to show the tooltip!
Below there is a list of all available commands you can use to override the standard CSS-Style:
ABOVE,false // false or true - tooltip above mousepointer
BGCOLOR,'#E2E7FF' // Background colour (HTML colour value, in quotes)
BGIMG,'picture.png' // Path to background image, none if empty string ''
BORDERCOLOR,'#003099'// Color of the tooltip-border
BORDERSTYLE,'solid' // Any permitted CSS value, but I recommend 'solid', 'dotted' or 'dashed'
BORDERWIDTH,1 // Width of the tooltip-border
CENTERMOUSE,false // false or true - center the tip horizontally below (or above) the mousepointer
CLICKCLOSE,false // false or true - close tooltip if the user clicks somewhere
CLICKSTICKY,false // false or true - make tooltip sticky if user left-clicks on the hovered element while the tooltip is active
CLOSEBTN,false // false or true - closebutton in titlebar
CLOSEBTNCOLORS,['#990000', '#FFFFFF', '#DD3333', '#FFFFFF'] // [Background, text, hovered background, hovered text] - use empty strings '' to inherit title colours
CLOSEBTNTEXT,' X ' // Close button text (may also be an image tag)
COPYCONTENT,true // When converting a HTML element to a tooltip, copy only the element's content, rather than converting the element by its own
DELAY,400 // Time span in ms until tooltip shows up
DURATION,0 // Time span in ms after which the tooltip disappears; 0 for infinite duration, < 0 for delay in ms _after_ the onmouseout until the tooltip disappears
EXCLUSIVE,false // false or true - no other tooltip can appear until the current one has actively been closed
FADEIN,100 // Fade-in duration in ms, e.g. 400; 0 for no animation
FADEOUT,100 // Fade-out duration in ms, e.g. 400; 0 for no animation
FADEINTERVAL,30 // Duration of each fade step in ms (recommended: 30) - shorter is smoother but causes more CPU-load
FIX,null // Fixated position, two modes. Mode 1: x- an y-coordinates in brackets, e.g. [210, 480]. Mode 2: Show tooltip at a position related to an HTML element: [ID of HTML element, x-offset, y-offset from HTML element], e.g. ['SomeID', 10, 30]. Value null (default) for no fixated positioning.
FOLLOWMOUSE,true // false or true - tooltip follows the mouse
FONTCOLOR,'#000044' // Color of the font
FONTFACE,'Verdana,Geneva,sans-serif'
FONTSIZE,'8pt' // E.g. '9pt' or '12px' - unit is mandatory
FONTWEIGHT,'normal' // 'normal' or 'bold';
HEIGHT,0 // Tooltip height; 0 for automatic adaption to tooltip content, < 0 (e.g. -100) for a maximum for automatic adaption
JUMPHORZ,false // false or true - jump horizontally to other side of mouse if tooltip would extend past clientarea boundary
JUMPVERT,true // false or true - jump vertically "
LEFT,false // false or true - tooltip on the left of the mouse
OFFSETX,14 // Horizontal offset of left-top corner from mousepointer
OFFSETY,8 // Vertical offset
OPACITY,100 // Integer between 0 and 100 - opacity of tooltip in percent
PADDING,3 // Spacing between border and content
SHADOW,false // false or true
SHADOWCOLOR,'#C0C0C0'// Color of the shadow
SHADOWWIDTH,5 // Width of the shadow
STICKY,false // false or true - fixate tip, ie. don't follow the mouse and don't hide on mouseout
TEXTALIGN,'left' // 'left', 'right' or 'justify'
TITLE,'' // Default title text applied to all tips (no default title: empty string '')
TITLEALIGN,'left' // 'left' or 'right' - text alignment inside the title bar
TITLEBGCOLOR,'' // If empty string '', BorderColor will be used
TITLEFONTCOLOR,'#FFFFFF' // Color of title text - if '', BgColor (of tooltip body) will be used
TITLEFONTFACE,'' // If '' use FontFace (boldified)
TITLEFONTSIZE,'' // If '' use FontSize
TITLEPADDING,2 // Padding of the tooltip-title
WIDTH,200 // Width of the Tooltip
The plugin uses wz_tooltips Javascript Library made by Walter Zorn (http://www.walterzorn.de)
Download: MNP Tooltips Plugin 1.1
