Merge branch 'container-tooltip-option' into v4-dev

docs/components/tooltips.md

@@ -165,7 +165,7 @@ Options can be passed via data attributes or JavaScript. For data attributes, ap
       </tr>
       <tr>
         <td>container</td>
-        <td>string | false</td>
+        <td>string | element | false</td>
         <td>false</td>
         <td>
           <p>Appends the tooltip to a specific element. Example: <code>container: 'body'</code>. This option is particularly useful in that it allows you to position the tooltip in the flow of the document near the triggering element - which will prevent the tooltip from floating away from the triggering element during a window resize.</p>

js/src/tooltip.js

@@ -46,7 +46,8 @@ const Tooltip = (($) => {
     selector    : false,
     placement   : 'top',
     offset      : '0 0',
-    constraints : []
+    constraints : [],
+    container   : false
   }
 
   const DefaultType = {
@@ -59,7 +60,8 @@ const Tooltip = (($) => {
     selector    : '(string|boolean)',
     placement   : '(string|function)',
     offset      : 'string',
-    constraints : 'array'
+    constraints : 'array',
+    container   : '(string|element|boolean)'
   }
 
   const AttachmentMap = {
@@ -274,9 +276,11 @@ const Tooltip = (($) => {
 
         const attachment = this._getAttachment(placement)
 
+        const container = this.config.container === false ? document.body : $(this.config.container)
+
         $(tip)
           .data(this.constructor.DATA_KEY, this)
-          .appendTo(document.body)
+          .appendTo(container)
 
         $(this.element).trigger(this.constructor.Event.INSERTED)