开始感到沮丧,这让我更难发现自己可能出错的地方,但本质上我正在尝试让 Bootstrap 的 jQuery 工具提示在将鼠标悬停在页面内容中的图像上时起作用。
正文中的 HTML:
<div class="tooltip-demo well">
<a title="Tooltip Text Goes Here" rel="tooltip" class="pennant-task" href="#">
<img src="/ssawp/wp-content/themes/wordpress-bootstrap/images/tasks/ytool-boatparts.jpg" />
</a>
</div>
标题:
<script type="text/javascript">
$('.tooltip-demo.well').tooltip({
selector: "a[rel=tooltip]"
})
</script>
<script src="bootstrap.js" type="text/javascript"></script>
我缩短了路径以使其更易于浏览,但请随时实时查看问题:
http://okamistudio.com/ssawp/pennants/
我正在尝试实现“黄色三 Angular 旗”文本 block 下方小船图标上的工具提示。
任何帮助或指导将不胜感激。
最佳答案
首先,在编写自己的代码之前,您需要包含 bootstrap.js
。其次,您需要将代码包装在文档就绪处理程序中。
此外,您还没有将其包含在示例中,因此为了完整起见,我也包含了所需的 jquery.js
。试试这个:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="bootstrap.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('.tooltip-demo.well').tooltip({
selector: "a[rel=tooltip]"
});
});
</script>
关于jquery - 无法让 boostraps jQuery 工具提示出现,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14787538/