w2toolbar.tooltip

ツールバーアイテムのツールチップを定義します。

String, default = 'top'

デフォルトでは、ツールチップはボタンの上側に表示します。 .tooltipプロパティを指定すると、別の位置に表示することができます。 指定可能な値はtop、bottom、left、rightです。 このプロパティを指定するには、 ツールバーアイテムの.tooltipを設定する必要があります。 このプロパティはオブジェクト作成時に定義することができます。

$('#toolbar').w2toolbar({
    name: 'toolbar',
    tooltip: 'bottom',
    items: [
        { type: 'check',  id: 'item1', text: 'Check', img: 'icon-page', checked: true,
        	tooltip: 'Check button'
        },
        { type: 'radio',  id: 'item3',  group: '1', text: 'Radio 1', img: 'icon-add',
        	tooltip: 'Check button'
        },
        { type: 'radio',  id: 'item4',  group: '1', text: 'Radio 2', img: 'icon-add',
        	tooltip: function (item) { return item.id; }
        }
    ]
});

または、ランタイム時に定義することもできます。

w2ui['toolbar'].tooltip = 'top';

ツールチップはマウスオーバーで表示されるため、w2utils.refresh()メソッドは不要です。

デモ

ボタンにマウスオーバーすると、ツールチップを表示します。

JavaScript

$('#toolbar').w2toolbar({
  name: 'mytoolbar',
  tooltip: 'bottom',
  items: [
    { type: 'check',  id: 'item1', text: 'Check', img: 'icon-page', checked: true,
      tooltip: 'チェックボタン'
    },
    { type: 'radio',  id: 'item3',  group: '1', text: 'Radio 1', img: 'icon-add',
      tooltip: 'ラジオボタン'
    },
    { type: 'radio',  id: 'item4',  group: '1', text: 'Radio 2', img: 'icon-add',
      tooltip: function (item) { return item.id; }
    }
  ]
});