Twitter Bootstrap tooltip funktioniert nicht

Habe ich heruntergeladen, Twitter Bootstrap und enthalten die .js Dateien in den footer. Ich wollte eine QuickInfo angezeigt, wenn Sie mit der Maus über ein info-Symbol. Also ich habe diesen code: 

<img src="<?php bloginfo('template_directory'); ?>/img/png/info.png" rel="tooltip" data-placement="top" title="blah blah blah">

Dann habe ich das Skript zum aktivieren der QuickInfo:

<script type="text/javascript">
jQuery(function () {
    $("[rel='tooltip']").tooltip();
});

Aber der tooltip erscheint nicht, wie auf der Beispiel-Seite über auf Twitter Bootstrap.
http://twitter.github.com/bootstrap/javascript.html#tooltips

Scheint es mit den default-styling von meinem Thema, das interessante an der Sache ist jedoch, wenn ich laden Sie die Twitter Bootstrap-plugin auf WordPress und aktivieren Sie die Javascript-Bibliothek in der plugin - es funktioniert. Aber der Haken ist jedoch, dass die Standard-CSS überschreibt meine CSS auf der website.

Hoffe ich hab mich klar genug ausgedrückt.

Alle Antworten sehr dankbar, da dies wurde Regalsysteme mein Gehirn für zwei Tage.

Arran

  • Bereiten Sie eine Geige für uns?
  • sicher - jsfiddle.net/Euqbz
  • Ähm, sind Sie sicher, dass Sie wissen, was Sie tun? Darunter jQuery und Twitter Tooltip wird empfohlen, lassen Sie es arbeiten 😉 Sehen Sie sich meine Antwort: stackoverflow.com/a/15246782/1250044
  • Ja, ich habe den bootstrap.js Datei und die jQuery.js Bibliothek in meinem footer.php Datei...
  • Mhh, es ist schwer zu sehen, Ihr problem sitzt! Schau auf meine Antwort, es funktioniert wie excpected: stackoverflow.com/a/15246782/1250044 Vielleicht haben Sie enthalten twitters Tooltip-plugin über jQuery?
InformationsquelleAutor Arran Scott | 2013-03-06
  1. 5

    Sollten Sie etwas wie dieses:

    <script type="text/javascript">
jQuery(function () {
    $("img[rel='tooltip']").tooltip();
});
</script>

    Attribut-Selektoren angewendet werden soll, auf die Elemente.

    InformationsquelleAutor web2008
  2. 0

    Funktioniert für mich als excpected. Sind Sie sicher, dass Sie aufgenommen haben jQuery und zwitschert Tooltip-plugin (in der richtigen Reihenfolge)?

    http://fiddle.jshell.net/xe5UX/2/

    • <script src="<?php bloginfo('template_directory'); ?>/js/bootstrap.js"></script> <script src="<?php bloginfo('template_directory'); ?>/js/bootstrap.min.js"></script><script src="<?php bloginfo('template_directory'); ?>/js/jQuery.js"></script>
    • können Sie einen link auf Ihre homepage?
    • Die website ist auf einem dev-server und der Zugriff ist nur über mein Heimnetz, kann ich Ihnen einen screenshot, wie die Tooltipps Aussehen, wenn Sie möchten, danke für deine Hilfe
    • Ja, das wäre hilfreich... Einfach Bearbeiten Sie Ihre Frage für, die.
    • dropbox.com/s/wg3pld748mvyroa/... - ich habe shared a link auf meine Dropbox Seite
    • Ist es ein Fehler in der Konsole?
    • Uncaught TypeError: Object [object object] has no method 'live'
    • Sehen, wenn ich mich in das bootstrap-plugin auf wordpress und aktivieren Sie die bootstrap-CSS-fragt es, wenn ich wollen, aktivieren Sie die Javascript-Bibliotheken auch...Wenn ich das Häkchen bei, dass es funktioniert...Aber das überschreibt meine CSS
    • Sorry, ich kann dir nicht helfen, ohne einen Blick hinter die kulissen...
    • Ok keine Sorge, vielen Dank für Ihre Zeit sowieso

    InformationsquelleAutor yckart
  3. 0

    @Arran ich habe auch das gleiche problem aber wenn ich ändern, "title ""data-original-title" Dann es funktioniert für mich.Diese zu verwenden:

    <img src="<?php bloginfo('template_directory'); ?>/img/png/info.png" rel="tooltip" data-placement="top" data-original-title="blah blah blah">
    InformationsquelleAutor Rajeev Thakur
Schreibe einen Kommentar