Skip to the main content


A Backbone view that renders a fully accessible dropdown menu.

Initialize the view by passing in the following attributes:

view = new DropdownMenuView({
    className: 'space separated string of classes for element',
    model: new Backbone.Model({
        main: {
            image: '',
            screenreader_label: 'Dashboard for: ',
            text: 'username',
            url: 'dashboard'
        button: {
            icon: 'icon-angle-down',
            label: 'User options dropdown'
        items: [
                text: 'Account',
                url: 'account_settings'
            }, {
                text: 'Sign Out',
                url: 'logout'
    parent: 'selector for parent element that will be replaced with dropdown menu',

Function to track analytics.

By default it doesn’t do anything, to utilize please extend the View and implement a method such as the following:

var $link = $(,
    label = $link.hasClass('menu-title') ? 'Dashboard' : $link.html().trim();'user_dropdown.clicked', {
    category: 'navigation',
    label: label,
    link: $link.attr('href')


event: object, The event to be tracked.

Returns: *, The event.