Warum funktioniert der Bootstrap Tooltip nicht mit dem Bootstrap Toggle Plugin?

Question

ich den folgenden Code haben, die ein Tooltip auf das Kontrollkästchen anzeigt, wenn der Benutzer darüber bewegt,

<input type="checkbox" data-toggle="toggle" rel="tooltip" data-placement="bottom" title="Automatic Refresh" /> 


<script type="text/javascript"> 

    $(document).ready(function(){ 
    $('[rel="tooltip"]').tooltip(); 
}); 

</script> 

Aber wenn ich diese Bibliothek Plugins aus dem Bootstrap Toggle hinzufügen zeigt die Checkbox ein Schiebeschalter zu machen, hält der Tooltip oben. Hier

<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet"> 
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script> 

ist ein Link zu dem, was ich bisher habe - http://jsbin.com/mepotaliti/edit?html,output

Irgendwelche Gedanken darüber, wie diese zu lösen?

Answer 1

Vielleicht keine gute Lösung, aber sehr schnell :)

<div rel="tooltip" data-placement="bottom" title="Automatic Refresh" style="width: 100px"> <input type="checkbox" checked data-toggle="toggle" style="width: 100%" /> </div>

Ich habe es ausprobiert und es funktioniert