First off: great module. simple, elegant, and so very useful.
I'm having an issue while testing this module before I put it to use: I can get the tooltips to appear fine inside node content, but in a custom block it does not appear.
My custom block is created by code in a module, and provides a top of page links menu. Adding toolTips makes great sense to providing hover help to my users unfamiliar with the site.
I'm using the tooltips_filter() function directly in my block logic like this:
/***************************************************************************************************
* return the content of the Store Header Links block
*/
function cggs_store_header_links()
{
$content = '<div class="store-header-links"> '
.l(t('store department name'), 'path to store department' ); /* imagine more links here */
$hoverTip = '';
if (function_exists( 'tooltips_filter' )) {
$hoverTip = "[tip:Help=For additional links,<\br>such as 'My Account' and 'Logout'<\br>see the bottom of the page.]";
$hoverTip = tooltips_filter( 'process', 0, -1, $hoverTip );
}
$products = uc_cart_get_contents();
$product_count = count($products);
$content .= '<br />'
.$hoverTip.' '
.l($product_count.' items in cart', 'cart')
.'</div>';
return $content;
}
As you can see, this processes the toolTip text in the same manner as a node's body text would be processed. The result is markup that looks the same between a toolTip that works, inside a node body, and the one that does not work inside a block.
This works, in a node:
<a href="javascript:;" class="tooltip">Text to highlight<span>The tooltip's content</span></a>
this does not, in a block:
<a href="javascript:;" class="tooltip">Help<span>For additional links,<\br>such as 'My Account' and 'Logout'<\br>see the bottom of the page.</span></a>
Examining the situation in Firebug, I'm seeing the a.tooltip:hover class appear when I hover over the block's toolTip text, and the toolTip text does have the dotted underline. However, no tooltip box appears when hovering over the block version of the toolTip text...
I tried setting the containing div (named 'store-header-links') to have an overflow property of 'visible', but that did not make any difference... I don't know if this information helps, but here's the CSS of the containing div:
div.store-header-links {
float: right;
clear: both;
color: #fff;
text-align: right;
overflow: visible;
}
div.store-header-links a:link, div.store-header-links a:visited {
color: #fff;
}
I also tried modifying tooltips.css to use "a.tooltip:hover { z-index: 500; }", but that made no difference...
Any ideas?