Alternate Tool-tips for DotNetNuke by DnnZone
Tool-tips on website are small things which can play a big role in website design. Default browser tool-tip has certain limitations, e.g. you cannot control the back-ground or text color and html tags are not supported in the default tool-tips.
Alternate Tool-tips is an alternate way to show nice looking tool-tips instead of the browser default one. You simply need to add this module to a page and it will convert the default tool-tips to nice looking alternate tool-tips.
You can see example of Alternate Tool-tips in following demo links:
How this Module Works?
You just need to add this module to a page, where you want to transform the default tool-tips into alternate tool-tips. Once module is added to the page, it will transform the tool-tips right away using the default settings. Settings can be changed from Module Settings page. You don't need to do anything special to the tool-tip text as this module will work on the title attribute (the same attribute on which the default tool-tips work).
Version 02.00.00
- Added support for alternate tool-tips for image (<img .../>) alt attribute
If you want to have alternate tool-tips on all pages, you can use the option "Display Module on All Pages?". If you have any questions/concerns, feel free to contact us at dnnzone@gmail.com.
Module Settings
You can customize following attributes of the Alternate Tool-tips module from module settings page:
- Text Color - Specify the color for tool-tip text. Color should be specified in RGB format (e.g. #FFFFFF).
- Background Color - Specify the color for tool-tip background. Color should be specified in RGB format (e.g. #222222).
- Border CSS - Specify the CSS for the border around the tool-tip control.
- Opacity - Specify the opacity factor (1-100) for the tool-tip control. Lower value means more transparency.
- Show Arrow - Setting to show/hide the small arrow on top left corner of the tool-tip.
Additionally, we provide color picker in module settings so that you can pick colors using a nice looking visual control.
Following are a couple of screenshot of module settings page:
