How do I create pop-ups on my web page?

*Tooltip module is invisible to viewers only the person with permission to view and edit may see the Tooltip once logged in.

Step 1: Add New Tooltip Module
Simply add an instance of Live Tooltip module to any page on your portal.

  • Click on "Manage Tooltips" (You must have edit rights to the module or logged in as admin/host to access "Manage Tooltips")
  • Create a new tooltip by providing a tooltip name and clicking on "Add"

Note:  Add tooltip, save and then click to reload the page in order to get out of the 'Manage Tooltips' area.

Step 2: Add New Tooltip
Tooltip can be assigned to any text or image by creating a link to #LiveTooltip[TooltipName]
In the example, it would be #LiveTooltip[Mandeeps]

Note: #LiveTooltip[TooltipName] syntax is case sensitive

DNN Text Editor can be used to easily create links and associate them with Live Tooltip. Simply highlight the text in the editor, click on Hyperlink Manager, and specify the URL as #LiveTooltip[TooltipName]

You can also attach the tooltip to form elements besides text and image links.

After adding Tooltip look below and you will see additional options available.   For Tooltip appearance click the Behavior tab.

  • Show Options include

    On Mouseover - Tooltip shows when the mouse is hovered over the target

    On Click - Tooltip shows when the target element is clicked

    On Focus - Tooltip is shown when target element comes into focus

  • Solo:  When clicked shows a single Tooltip on the page by closing all other visible Tooltips on the page.
  • Auto Launch:  When checked will launch the Tooltip automatically when the page is loaded and the user will need to close the window before viewing the web page, if checked make sure to also check the Close Button.
  • Delay:  Allows the user to specify time in milliseconds to delay hiding of the Tooltip.

Effects are also available under the Effect tab:  No Effect, Fade In/Out, and Slide Up/Down

Add Feedback