|
overLIB is a JavaScript library created to enhance websites with small popup information boxes (like tooltips) to help visitors around your website. It is now extremely easy and simple to add these popups with the "Simple overLIB Plugin" for Joomla 1.5.
Here are some examples:
- This is a basic popup with no title
{ overlib }This is a basic popup with no title:This popup demostrates how to use the NO_TITLE to hide the title of a popup:NO_TITLE{ /overlib }
- This is a basic popup
{ overlib }This is a basic popup:This is the text that will appear inside the popup:Basic Popup Example{ /overlib }
- This is a sticky popup
{ overlib }This is a sticky popup:This popup will 'stick' around:Sticky Popup Example:Close:1{ /overlib }
- This is a sticky popup with close
{ overlib }This is a sticky popup with close:This popup will 'stick' around until closed:Sticky Popup With Close Example:Close:1:1{ /overlib }
- This is a sticky popup with different colours
{ overlib }This is a sticky popup with different colours:This popup has different colours to the default popup:Different colour sticky popup:Close:1:1:::::::::1:999999:333333:::FF0000{ /overlib }
HOW TO INSTALL
Step 1
First install the Simple overLIB Plugin using the Joomla 1.5 installer.
Step 2
Create a new content item (or open an existing one) and simply insert { overlib }This is a basic popup:This is the text that will appear inside the popup:Basic Popup Example{ /overlib }, where you want your thumbnail to
appear inside your text. It doesn't have to be at the end of your article, it can be anywhere within your content item.
Step 3
Open up your site and you should see your overLIB popup inside your article. You can add as many popups as you want in each content item.
SETTINGS
{ overlib }
LINK_TEXT : POPUP_TEXT : POPUP_TITLE : CLOSE_TEXT :
STICKY? : CLOSE_CLICK : WIDTH : HEIGHT :
ALIGNMENT : VALIGNMENT : OFFSET_X : OFFSET_Y :
TIMEOUT : DELAY : BORDER_WIDTH : COLOR_FG :
COLOR_BG : COLOR_TEXT : COLOR_POPUPTITLE : COLOR_CLOSE :
FONT_TEXT : FONT_POPUPTITLE :
FONT_CLOSE : SIZE_TEXT : SIZE_POPUPTITLE : SIZE_CLOSE : CAPICON : WRAP :
FULLHTML : FOLLOWMOUSE
{ /overlib }
LINK_TEXT
This is the text that appears within the content article. The popup appears in reference to this text.
|
|
| Options: |
TEXT |
| If Not Set: |
Plugin will not work |
| Example: |
{ overlib }This is the LINK_TEXT:::::::::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
POPUP_TEXT
This is the text that appears within the popup box.
|
|
| Options: |
TEXT |
| If Not Set: |
Will not display any text in the popup |
| Example: |
{ overlib }:This is the POPUP_TEXT::::::::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
POPUP_TITLE
This is the title that will be used on the popup box. Can also be turned off.
|
|
| Options: |
TEXT or 'NO_TITLE' |
| If Not Set: |
Will automatically pick up the default value from plugin settings. |
| Example: |
{ overlib }::Popup Box Title:::::::::::::::::::::::::::{ /overlib } or { overlib }::NO_TITLE:::::::::::::::::::::::::::{ /overlib } |
| Notes: |
Using 'NO_TITLE' will show a popup box without the title. |
CLOSE_TEXT
This is the text that will replace the default 'Close' text.
|
|
| Options: |
TEXT |
| If Not Set: |
Will default to 'Close' |
| Example: |
{ overlib }:::X::::::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
STICKY?
This option allows you to set whether you would like the popup to 'stick' on the screen.
|
|
| Options: |
NULL or 1 |
| If Not Set: |
Popups will disappear when mouse is moved away from the link text. |
| Example: |
{ overlib }::::1:::::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
CLOSE_CLICK
This option allows you to force users to click on the 'Close' command on the popup to make it go away.
|
|
| Options: |
NULL or 1 |
| If Not Set: |
Popups will disappear when mouse is moved away from the link text. |
| Example: |
{ overlib }:::::1::::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
WIDTH
Allows the user to fix the width of the popup box (In pixels).
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Will default to the width of the contained text. |
| Example: |
{ overlib }::::::200:::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
HEIGHT
Allows the user to fix the height of the popup box (In pixels).
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Will default to the height of the contained text. |
| Example: |
{ overlib }:::::::200::::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
ALIGNMENT
Allows the horizontal alignment of the popup box.
|
|
| Options: |
LEFT or CENTER or RIGHT or NULL |
| If Not Set: |
Will default to 'RIGHT' |
| Example: |
{ overlib }::::::::CENTER:::::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
VALIGNMENT
Allows the vertical placement of the popup box.
|
|
| Options: |
ABOVE or BELOW or NULL |
| If Not Set: |
Will default to 'BELOW' |
| Example: |
{ overlib }:::::::::ABOVE::::::::::::::::::::{ /overlib } |
| Notes: |
In order for this vertical alignment to work, the HEIGHT variable must be set. |
OFFSET_X
How far away from the mouse pointer the popup will show, horizontally.
Positive values move the popup towards the right edge of the window and negative values move it towards the left edge of the window.
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Defaults to '10' |
| Example: |
{ overlib }::::::::::20:::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
OFFSET_Y
How far away from the mouse pointer the popup will show, vertically.
Positive values move the popup downward and negative values move it upwards.
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Defaults to '10' |
| Example: |
{ overlib }:::::::::::20::::::::::::::::::{ /overlib } |
| Notes: |
NIL |
TIMEOUT
Setting this option makes the popup disappear in a set amount of time (in milliseconds) after first being shown.
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Defaults to '0' |
| Example: |
{ overlib }::::::::::::500:::::::::::::::::{ /overlib } |
| Notes: |
NIL |
DELAY
Setting this option makes the popup appears in a specified period of time (in milliseconds).
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Defaults to '0' |
| Example: |
{ overlib }:::::::::::::500::::::::::::::::{ /overlib } |
| Notes: |
NIL |
BORDER_WIDTH
Sets the width (in pixels) that will be used as the border for the popup.
|
|
| Options: |
NUMERICAL or NULL |
| If Not Set: |
Defaults to '1' |
| Example: |
{ overlib }::::::::::::::5:::::::::::::::{ /overlib } |
| Notes: |
NIL |
COLOR_FG
Set the colour of the inside of the popup box (Hexadecimal value).
|
|
| Options: |
HEXVALUE or NULL |
| If Not Set: |
Defaults to 'CCCCFF' |
| Example: |
{ overlib }:::::::::::::::00FF00::::::::::::::{ /overlib } |
| Notes: |
Even though a Hexadecimal Colour reference is being used, be sure not to affix the '#' |
COLOR_BG
Set the colour of the border of the popup box (Hexadecimal value).
|
|
| Options: |
HEXVALUE or NULL |
| If Not Set: |
Defaults to '333399' |
| Example: |
{ overlib }::::::::::::::::FF0000:::::::::::::{ /overlib } |
| Notes: |
Even though a Hexadecimal Colour reference is being used, be sure not to affix the '#' |
COLOR_TEXT
Set the colour of the text inside the popup box (Hexadecimal value).
|
|
| Options: |
HEXVALUE or NULL |
| If Not Set: |
Defaults to '000000' |
| Example: |
{ overlib }:::::::::::::::::0000FF::::::::::::{ /overlib } |
| Notes: |
Even though a Hexadecimal Colour reference is being used, be sure not to affix the '#' |
COLOR_POPUPTITLE
Set the colour of the text in the popup title (Hexadecimal value).
|
|
| Options: |
HEXVALUE or NULL |
| If Not Set: |
Defaults to 'FFFFFF' |
| Example: |
{ overlib }::::::::::::::::::FF0000:::::::::::{ /overlib } |
| Notes: |
Even though a Hexadecimal Colour reference is being used, be sure not to affix the '#' |
COLOR_CLOSE
Set the colour of the 'Close' text (Hexadecimal value).
|
|
| Options: |
HEXVALUE or NULL |
| If Not Set: |
Defaults to '9999FF' |
| Example: |
{ overlib }:::::::::::::::::::FF000F::::::::::{ /overlib } |
| Notes: |
Even though a Hexadecimal Colour reference is being used, be sure not to affix the '#' |
FONT_TEXT
Set the font to be used by the link text.
|
|
| Options: |
TEXT or NULL |
| If Not Set: |
Defaults to 'Verdana,Arial,Helvetica' |
| Example: |
{ overlib }::::::::::::::::::::Times Roman:::::::::{ /overlib } |
| Notes: |
NIL |
FONT_POPUPTITLE
Set the font to be used by the popup title.
|
|
| Options: |
TEXT or NULL |
| If Not Set: |
Defaults to 'Verdana,Arial,Helvetica' |
| Example: |
{ overlib }::::::::::::::::::::Times Roman:::::::::{ /overlib } |
| Notes: |
NIL |
FONT_CLOSE
Set the font to be used by the 'Close' text.
|
|
| Options: |
TEXT or NULL |
| If Not Set: |
Defaults to 'Verdana,Arial,Helvetica' |
| Example: |
{ overlib }::::::::::::::::::::::Times Roman:::::::{ /overlib } |
| Notes: |
NIL |
SIZE_TEXT
Set the size of the font used for the main text (In pixels).
|
|
| Options: |
NUMERICAL or PIXELSor NULL |
| If Not Set: |
Defaults to '1' |
| Example: |
{ overlib }:::::::::::::::::::::::10px::::::{ /overlib } |
| Notes: |
When using pixels as the measurement, please be sure to append 'px' after the digits eg. '10px' |
SIZE_POPUPTITLE
Set the size of the font used for the popup title (In pixels).
|
|
| Options: |
NUMERICAL or PIXELS or NULL |
| If Not Set: |
Defaults to '1' |
| Example: |
{ overlib }::::::::::::::::::::::::10px:::::{ /overlib } |
| Notes: |
When using pixels as the measurement, be sure to append 'px' after the digits eg. '10px' |
SIZE_CLOSE
Set the size of the font used for the 'Close' text (In pixels).
|
|
| Options: |
NUMERICAL or PIXELS or NULL |
| If Not Set: |
Defaults to '1' |
| Example: |
{ overlib }:::::::::::::::::::::::::10px::::{ /overlib } |
| Notes: |
When using pixels as the measurement, be sure to append 'px' after the digits eg. '10px' |
CAPICON
Displays a small icon before the Popup title.
|
|
| Options: |
FILENAME or NULL |
| If Not Set: |
Will not show an image. |
| Example: |
{ overlib }::::::::::::::::::::::::::images/smallicon.gif:::{ /overlib } |
| Notes: |
NIL |
WRAP
When set, will wrap the popup box as tightly as possible around the text in the popup box.
|
|
| Options: |
NULL or 1 |
| If Not Set: |
Will have no affect on display of popup box |
| Example: |
{ overlib }:::::::::::::::::::::::::::1::{ /overlib } |
| Notes: |
NIL |
FULLHTML
When set, will assume that LINK_TEXT is correct HTML and allow the display of the HTML.
|
|
| Options: |
NULL or 1 |
| If Not Set: |
Will assume that LINK_TEXT is plain text. |
| Example: |
{ overlib }Test HTML::::::::::::::::::::::::::::1:{ /overlib } |
| Notes: |
NIL |
FOLLOWMOUSE
Sets the popup box to follow the mouse pointer.
|
|
| Options: |
NULL or 1 |
| If Not Set: |
Displays the popup box relative to the popup link |
| Example: |
{ overlib }:::::::::::::::::::::::::::::1{ /overlib } |
| Notes: |
Works best when used along with the STICKY option. |
TROUBLESHOOTING
As we have just designed and written this plugin, we are yet to find any problems with it. If you do have any problems, please visit the Australian Quality Solutions Group Forum and post in the relevant forum.
COPYRIGHT DISCLAIMER
"Simple overLIB Plugin" (Version 1.0.0) - Australian Quality Solutions Group http://www.aqsg.com.au
- Developers: Joel Bassett
"drb_overlib" (Joomla 1.0.x) - IdiotProofComputing http://www.idiotproofcomputing.com.au
- Developers: Dean Bassett
"overLIB mambot" (Mambo) - Tim-Online.nl http://www.tim-online.nl
- Developers: Adam van Dongen
"overLIB" - overLIB http://www.bosrup.com/web/overlib/
- Developers: Erik Bosrup
CREDITS
The "Simple overLIB Plugin" from Australian Quality Solutions Group makes use of the following open source/free projects:
|
|
Tutorials/Guides