发表新帖
发表新帖

Bootstrap tooltips not working

前端 未结
关注
25 1721
孤城傲影
孤城傲影 2020-11-28 17:46

I\'m going mad here.

I\'ve got the following HTML:
相关标签:
25条回答
  • 臣服心动
    2020-11-28 18:27

    Put your code inside document ready

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

    In my case I was also missing the tooltip css classes on http://twitter.github.com/bootstrap/assets/css/bootstrap.css so son't forget that.

    0 讨论(0)
  • 借酒劲吻你
    2020-11-28 18:28

    To sum up: activate your tooltips using jQuery selectors

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

    In fact, you don't need to use the attribute selector, you can invoke it on any element even if it doesn't have rel="tooltip" in its tag.

    0 讨论(0)
  • 萌比男神i
    2020-11-28 18:30

    You don't need all js files separately

    Just use the following files if you are going to use all bootstrap functions:

    -bootstrap.css
-bootstrap.js

    both of them can be found in http://twitter.github.com
    and finally
    -Latest version of jquery.js

    For Glyphicons you need the image

    glyphicons-halfings.png and/or glyphicons-halfings-white.png(white coloured images)
    which you need to upload inside /img/ folder of your website (or) store it where ever you want but change the folder directory inside the bootstrap.css

    For tooltip you need the following script inside your <head> </head> tag

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

    That's it...

    0 讨论(0)
  • 离开以前
    2020-11-28 18:30

    You need to do the following. Add the

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

    code somewhere on your page (preferably in the <head> section).

    Also add data-toggle: "tooltip" to anything you want to enable with it.

    0 讨论(0)
  • 再見小時候
    2020-11-28 18:31

    This is the simplest way. Just put this before </body>:

    <script type="text/javascript">
    $("[data-toggle=\"tooltip\"]").tooltip();
</script>

    Check out the examples given in the Bootstrap's documentation about tooltips.

    For example: 

    <a href="#"
   data-toggle="tooltip"
   data-placement="bottom"
   title="Tooltip text here">Link with tooltip</a>
    0 讨论(0)
  • 天命终不由人
    2020-11-28 18:32

    If using Rails+Haml is much easier to include the tooltip, just do:

    = link_to '', some_path(), :class => "btn btn-success btn-mini icon-plane", :rel => "tooltip", :title => "Referential Guide"

    That is just add the following line at the end of the element.

    :rel => "tooltip", :title => "Referential Guide"
    0 讨论(0)
 看不清?
提交回复
热议问题