Skip to content
This repository has been archived by the owner on Aug 16, 2024. It is now read-only.

Latest commit

 

History

History
45 lines (37 loc) · 1.21 KB

README.md

File metadata and controls

45 lines (37 loc) · 1.21 KB

Marionette.Tooltip

How about another tooltip library?

Example

define(['marionette', 'marionette.tooltip'], function (Marionette, Tooltip) {
    // tooltip content
    var TooltipView = Marionete.ItemView.extend({
        template: '#tooltip-template'
    });

    // just another element
    var TargetView = Marionette.ItemView.extend({
        template: '#target-template',

        ui: {
            tooltipTarget: '#tooltip' // optionally, this.$el by default
        },

        events: {
            // some tooltip controls by events
            click: function () { this.triggerMethod('toggle:tooltip'); },
            mouseenter: function () { this.triggerMethod('show:tooltip'); },
            mouseleave: function () { this.triggerMethod('hide:tooltip'); }
        },

        behaviors: {
            // tooltip options
            tooltip: {
                behaviorClass: Tooltip,
                className: 'tooltip',
                prevents: 'click', // ['click', 'mouseenter', ...]
                direction: 'left'  // right, top, bottom
            }
        },

        getTooltip: function () {
            return TooltipView.extend({ /* ... */ })
        }
    });
});