Page 1 of 1

Tooltip BBCode

Posted: 09 Mar 2010, 06:53
by BBCode Bot
Tooltip BBCode [tooltip]Hope you like this BBCode :thanks:[/tooltip]

Author: Stoker, CSS from the phpBB Arcade
Description: The Tooltip BBCode lets you insert tooltips in your post.
Image
Attached file:
toolfaq.zip
(375 Bytes) Downloaded 788 times
Download, unzip and upload the image to your forums images folder.
File edits:
Prosilver: open styles/prosilver/theme/colours.css and paste the following code in the bottom
Subsilver2: open styles/subsilver2/theme/stylesheet.css and paste the following code in the bottom

Code: Select all

a.tool {
	font-weight: bold;
	position: relative;
	text-decoration: none;
	cursor: help;
}

a.tool span {
	position: absolute;
	font-weight: normal;
	border: 1px solid black;
	background-color: #CFE1F6;
	padding: 10px;		
	color: black;
	width: 225px;

	left: -9999em;
}

a.tool:hover {
	visibility: visible;
	z-index: 100;
}

a.tool:hover span, a.tooltip:focus span {
	left: 30px;
	text-decoration: none;
}
Save, upload and refresh theme.

BBCode:

Code: Select all

[tooltip]{TEXT}[/tooltip]
HTML:

Code: Select all

<a href="#" class="tool"><img style="width:16; height:14px;" src="images/toolfaq.gif" alt="" /><span>{TEXT}</span></a>
Helpline:

Code: Select all

Tooltip: [tooltip]Message[/tooltip]
Example:

Code: Select all

[tooltip]Hope you like this BBCode  :thanks:[/tooltip]
Demo:
Lets write some demo text [tooltip]Hope you like this BBCode :thanks:[/tooltip]
Its supports smilies and bbcodes
And so on....
More test..