Difference between revisions of "Tooltips"

From Tweeki
Jump to: navigation, search
 
(One intermediate revision by the same user not shown)
Line 2: Line 2:
  
 
To use Bootstrap's [http://getbootstrap.com/javascript/#tooltips tooltips] you need to set <code>$wgTweekiSkinUseTooltips</code> to <code>true</code> and use the <code>data-toggle="tooltip"</code> attribute:
 
To use Bootstrap's [http://getbootstrap.com/javascript/#tooltips tooltips] you need to set <code>$wgTweekiSkinUseTooltips</code> to <code>true</code> and use the <code>data-toggle="tooltip"</code> attribute:
 +
  
 
{| class="table table-bordered"
 
{| class="table table-bordered"
Line 8: Line 9:
 
|
 
|
 
<pre>
 
<pre>
<btn data-toggle="tooltip" title="tooltip">
+
<btn data-toggle="tooltip" title="this is my tooltip">
 
   Tooltip Button
 
   Tooltip Button
 
</btn>
 
</btn>
 
</pre>
 
</pre>
 
|
 
|
<btn data-toggle="tooltip" title="tooltip">Tooltip Button</btn>
+
<btn data-toggle="tooltip" title="this is my tooltip">Tooltip Button</btn>
 
|-
 
|-
 
|
 
|
 
<pre>
 
<pre>
<span data-toggle="tooltip" title="tooltip">
+
<span data-toggle="tooltip" title="this is my tooltip">
 
   Tooltip Span
 
   Tooltip Span
 
</span>
 
</span>
 
</pre>
 
</pre>
 
|
 
|
<span data-toggle="tooltip" title="tooltip">Tooltip Span</span>
+
<span data-toggle="tooltip" title="this is my tooltip">Tooltip Span</span>
 
|}
 
|}

Latest revision as of 15:22, 18 February 2019


To use Bootstrap's tooltips you need to set $wgTweekiSkinUseTooltips to true and use the data-toggle="tooltip" attribute:


Markup Result
<btn data-toggle="tooltip" title="this is my tooltip">
  Tooltip Button
</btn>

Tooltip Button

<span data-toggle="tooltip" title="this is my tooltip">
  Tooltip Span
</span>

Tooltip Span