diff --git a/IPython/html/static/widgets/js/widget_bool.js b/IPython/html/static/widgets/js/widget_bool.js
index 5236158..f8406ab 100644
--- a/IPython/html/static/widgets/js/widget_bool.js
+++ b/IPython/html/static/widgets/js/widget_bool.js
@@ -76,7 +76,7 @@ define([
e.preventDefault();
that.handle_click();
}));
-
+ this.$el.attr("data-toggle", "tooltip");
this.model.on('change:button_style', function(model, value) {
this.update_button_style();
}, this);
@@ -113,6 +113,7 @@ define([
this.$el.prop('disabled', disabled);
var description = this.model.get('description');
+ this.$el.attr("title", this.model.get("tooltip"));
if (description.trim().length === 0) {
this.$el.html(" "); // Preserve button height
} else {
diff --git a/IPython/html/widgets/widget_bool.py b/IPython/html/widgets/widget_bool.py
index bd39e21..87f1efd 100644
--- a/IPython/html/widgets/widget_bool.py
+++ b/IPython/html/widgets/widget_bool.py
@@ -38,6 +38,7 @@ class ToggleButton(_Bool):
"""Displays a boolean `value`."""
_view_name = Unicode('ToggleButtonView', sync=True)
+ tooltip = Unicode(help="Tooltip caption of the toggle button.", sync=True)
button_style = CaselessStrEnum(
values=['primary', 'success', 'info', 'warning', 'danger', ''],