twitter引导工具提示与图像

我目前使用twitter bootstrap添加工具提示。twitter引导工具提示与图像

继承人我JS：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<link rel="stylesheet" type="text/css" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css"/> 
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-tooltip.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
$("a img").tooltip({'placement': 'right'}); 
}); 
</script>

我想的图像与具有rel ATTR的jQuery追加了这样的提示：

$(".info").append('<a href="#" rel="tooltip" title="first tooltip"><img src="http://extrarewards.nationalexpress.com/images/assets/info_icon.png"/></a>');});

没有这个作品的形象，但只要我在其中添加图像停止工作。

任何想法上述有什么问题？

来源

2013-06-27 danyo

向我们展示你的HTML代码也 – Cherniv

这是php这样的HTML是动态生成 – danyo

这样告诉我们创建PHP代码'img' – Cherniv

您的.append上的语法已关闭。尝试：

$(".info").append('<a href="#" rel="tooltip" title="first tooltip"><img src="http://extrarewards.nationalexpress.com/images/assets/info_icon.png"></a>');

演示：Bootply.com/65857

来源

2013-06-27 13:42:57 ZimSystem

完美谢谢！ – danyo

嗨它似乎你已经解决了你的问题。但我想为您的问题提供不同的解决方案。我个人使用这种方法添加工具提示文字到图像。

这是我的HTML部分。

<a href="#" data-toggle="tooltip" title="Your tool tip text here."><img src="imgs/sample.png"></a>

现在这里是Jquery的部分

<script> 
$(document).ready(function(){ 
$('[data-toggle="tooltip"]').tooltip(); 
}); 
</script>

如果你想知道更多关于你可以参考this引导提示。

来源

2016-02-10 06:04:41

在我看来

最佳方式

<a href="#" data-toggle="tooltip" data-placement="bottom" title="<img src='../../images/mrraja.jpg' width='105' height='130' />">1</a> 

<script> 
$(document).ready(function(){ 
$('a[data-toggle="tooltip"]').tooltip({ 
animated: 'fade', 
placement: 'bottom', 
html: true 
}); 
}); 
</script>

来源

2016-05-17 08:38:05 MRRaja

twitter引导工具提示与图像

回答

相关问题