diff --git a/docs/javascript.html b/docs/javascript.html
index 82dcffba75..90b7be0c53 100644
--- a/docs/javascript.html
+++ b/docs/javascript.html
@@ -487,8 +487,8 @@ $('#.tabs').bind('change', function (e) {
Name |
- type |
- default |
+ type |
+ default |
description |
@@ -557,7 +557,13 @@ $('#.tabs').bind('change', function (e) {
template |
string |
[default markup] |
- The html template used for rendering a twipsy. |
+ the html template used for rendering a twipsy |
+
+
+ contentSelector |
+ string |
+ .twipsy-inner |
+ selector used to find the title element within the tooltip |
@@ -613,8 +619,8 @@ $('#.tabs').bind('change', function (e) {
Name |
- type |
- default |
+ type |
+ default |
description |
@@ -689,7 +695,19 @@ $('#.tabs').bind('change', function (e) {
template |
string |
[default markup] |
- The html template used for rendering a popover. |
+ the html template used for rendering a popover |
+
+
+ titleSelector |
+ string |
+ .title |
+ selector used to find the title element within the popover |
+
+
+ contentSelector |
+ string |
+ .content p |
+ selector used to find the content element within the popover |
diff --git a/js/bootstrap-twipsy.js b/js/bootstrap-twipsy.js
index e249c815d7..9eb6e79f4e 100644
--- a/js/bootstrap-twipsy.js
+++ b/js/bootstrap-twipsy.js
@@ -119,7 +119,7 @@
, setContent: function () {
var $tip = this.tip()
- $tip.find('.twipsy-inner')[this.options.html ? 'html' : 'text'](this.getTitle())
+ $tip.find(this.options.contentSelector)[this.options.html ? 'html' : 'text'](this.getTitle())
$tip[0].className = 'twipsy'
}
@@ -302,10 +302,11 @@
, title: 'title'
, trigger: 'hover'
, template: ''
+ , contentSelector: '.twipsy-inner'
}
$.fn.twipsy.elementOptions = function(ele, options) {
return $.extend({}, options, $(ele).data())
}
-}( window.jQuery || window.ender );
\ No newline at end of file
+}( window.jQuery || window.ender );
diff --git a/js/tests/unit/bootstrap-popover.js b/js/tests/unit/bootstrap-popover.js
index 3e13d2fd20..69f3e0d7fa 100644
--- a/js/tests/unit/bootstrap-popover.js
+++ b/js/tests/unit/bootstrap-popover.js
@@ -73,4 +73,27 @@ $(function () {
$('#qunit-runoff').empty()
})
-})
\ No newline at end of file
+ test("should allow arbitrary template html with title and content selector options", function() {
+ $.support.transition = false
+ var expectedTitle = 'Gotta make you understand'
+ , popover = $('@rvagg')
+ .attr('title', expectedTitle)
+ .data('content', 'Never gonna give you up,
Never gonna let you down
')
+ .appendTo('#qunit-runoff')
+ .popover({
+ html: true
+ , titleSelector: 'h1'
+ , contentSelector: '.rick > .roll'
+ , template: ''
+ })
+ .popover('show')
+
+ ok($('.popover > div > h1').length, 'h1 tag was inserted')
+ ok($('.popover > div > h1').text() === expectedTitle)
+ ok($('.popover > .rick > .roll > p').length === 2, 'p > b tags were inserted')
+ popover.popover('hide')
+ ok(!$('.popover').length, 'popover was removed')
+ $('#qunit-runoff').empty()
+ })
+
+})
diff --git a/js/tests/unit/bootstrap-twipsy.js b/js/tests/unit/bootstrap-twipsy.js
index 04000696ae..74855931a6 100644
--- a/js/tests/unit/bootstrap-twipsy.js
+++ b/js/tests/unit/bootstrap-twipsy.js
@@ -78,4 +78,22 @@ $(function () {
$('#qunit-runoff').empty()
})
-})
\ No newline at end of file
+ test("should allow arbitrary template html with content selector options", function() {
+ $.support.transition = false
+ var twipsy = $('')
+ .appendTo('#qunit-runoff')
+ .twipsy({
+ html: true
+ , contentSelector: 'h1'
+ , template: 'Funky Twipsy!
@rvagg was here
'
+ })
+ .twipsy('show')
+
+ ok($('.twipsy h1').length, 'h1 tag was inserted')
+ ok($('.twipsy p>b').length, 'p > b tags were inserted')
+ ok($('.twipsy h1>b').length, 'h1 tag was customised')
+ twipsy.twipsy('hide')
+ ok(!$(".twipsy").length, 'twipsy removed')
+ $('#qunit-runoff').empty()
+ })
+})