bootstrap tooltip使用方法

最新推荐文章于 2025-10-13 10:26:25 发布

原创最新推荐文章于 2025-10-13 10:26:25 发布 · 4k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍了如何在网页中使用JQuery实现Tooltip组件，并通过代码示例展示了如何通过鼠标悬停来显示和隐藏提示信息。

Tooltip必须要通过js初始化方能使用，在Jquery中代码如下：

    $('.tooltip-check').mouseover(function() {
      $(this).tooltip('show')
    })
    $('.tooltip-check').mouseout(function() {
      $(this).tooltip('hide')
    })

.tooltip-check为css中的类名，在页面中如下调用：

<div  data-placement="left" data-title="记住我?" class=" checkbox switch switch-small make-switch tooltip-check" data-delay="300" data-animated="false">  
    <input type="checkbox" unchecked data-toggle="tooltip"/>
</div>