 
     $('.fr-body').on 'mouseenter mouseleave focusin focusout', '.xforms-control', (event) ->
         controlEl = $(event.target).closest('.xforms-control')
-        tooltipEl = controlEl.find('.xforms-appearance-tooltip')
-        controlHasTooltip = tooltipEl.is('*')
-        if controlHasTooltip
-            Tooltip.init(controlEl, tooltipEl)
+        lhhaEls = controlEl.find('.xforms-appearance-tooltip, .xforms-appearance-popover')
+        controlHasTooltipPopover = lhhaEls.is('*')
+        if controlHasTooltipPopover
+            TooltipPopover.init(controlEl, lhhaEls)
             if ! tooltipShownBecauseOfFocus
-                if event.type == 'mouseenter' then Tooltip.show(controlEl)
-                if event.type == 'mouseleave' then Tooltip.hide(controlEl, event)
+                if event.type == 'mouseenter' then TooltipPopover.show(controlEl)
+                if event.type == 'mouseleave' then TooltipPopover.hide(controlEl, event)
             if event.type == 'focusin'
-                Tooltip.show(controlEl)
+                TooltipPopover.show(controlEl)
                 tooltipShownBecauseOfFocus = true
             if event.type == 'focusout'
-                Tooltip.hide(controlEl, event)
+                TooltipPopover.hide(controlEl, event)
                 tooltipShownBecauseOfFocus = false
 
-    # Facade for Bootstrap's show/hide
+    # Facade for Bootstrap's Tooltip component
     # - ensures we don't show an already visible tooltip, which would make it "blink"
-    Tooltip =
-        _tooltipShownForEl: null
+    TooltipPopover =
+        DataPrefix: 'xforms-tooltip-popover-'
+        Initialized: @DataPrefix + 'initialized'
+        Methods: @DataPrefix + 'methods'
+        _tooltipPopoverShownForControlEl: null
 
         # Create the underlying Bootstrap tooltip (but don't show it just yet)
-        init: (controlEl, tooltipEl) ->
-            tooltipAlreadyInitialized = controlEl.data('xforms-tooltip-initialized') == 'true'
-            if ! tooltipAlreadyInitialized
-                controlEl.tooltip
-                    placement: 'bottom',
-                    trigger: 'manual',
-                    title: tooltipEl.text()
-                controlEl.data('xforms-tooltip-initialized', 'true')
+        init: (controlEl, lhhaEls) ->
+            alreadyInitialized = controlEl.data(@Initialized) == 'true'
+            if ! alreadyInitialized
+                methods = []
+                _.each lhhaEls, (lhhaEl) ->
+                    lhhaEl = $(lhhaEl)
+                    if lhhaEl.hasClass('xforms-appearance-tooltip')
+                        controlEl.tooltip
+                            placement: 'bottom',
+                            trigger: 'manual',
+                            title: lhhaEl.text()
+                        methods.push('tooltip')
+                    if lhhaEl.hasClass('xforms-appearance-popover')
+                        controlEl.popover
+                            placement: 'right',
+                            trigger: 'manual',
+                            title: controlEl.find('.xforms-label').text()
+                            content: lhhaEl.text()
+                        methods.push('popover')
+                controlEl.data(@Methods, methods)
 
         # Show tooltip for control
         # - but don't show if the tooltip is alrady shown for this control
         show: (controlEl) ->
-            sameControl = controlEl.is(@_tooltipShownForEl)
+            sameControl = controlEl.is(@_tooltipPopoverShownForControlEl)
             if ! sameControl
-                @_tooltipShownForEl.tooltip('hide') if @_tooltipShownForEl?
-                controlEl.tooltip('show')
-                @_tooltipShownForEl = controlEl
+                @_callMethods(@_tooltipPopoverShownForControlEl, 'hide') if @_tooltipPopoverShownForControlEl?
+                @_callMethods(controlEl, 'show')
+                @_tooltipPopoverShownForControlEl = controlEl
 
         # Hide tooltip for control
         # - but don't hide if the element we're going to (if any) is the same as the current one

    # - LHHA shown as tooltip have the xforms-appearance-tooltip class
    _.each $('.fr-body .xforms-control'), (control) ->
        control = $(control)
        hintEl = control.find('.xforms-hint')
        hintEl.addClass('xforms-hidden')
        hintEl.addClass('xforms-appearance-tooltip')

    # Keep track of whether a tooltip is shown and this is because a control got the focus
    # - used to diactivate hiding/showing tooltip based on mouse movements

            toControlEl = toTargetEl.closest('.xforms-control')
            sameControl = controlEl.is(toControlEl)
            if ! sameControl
                @_callMethods(controlEl, 'hide')
                @_tooltipPopoverShownForControlEl = null

        _callMethods: (controlEl, arg) ->
            methods = controlEl.data(@Methods)
            _.each methods, (method) -> controlEl[method].call(controlEl, arg)
