我想创建一个带有链接的图像的工具提示,现在我已经使用了一个链接,但是它不适用于第二个图像。
这是我的示例代码:
<!-- trigger element. a regular workable link -->
<a id="test" title="Name - Title">Name</a>
<!-- tooltip element -->
<div class="tooltip">
<div><span class="name">Name</span><br />
Title
<span><a href="#">more info»</a></span></div>
</div>
<!-- trigger element. a regular workable link -->
<a id="test2" title="Name - Title">Name</a>
<!-- tooltip element -->
<div class="tooltip2">
<div><span class="name">Name</span><br />
Title
<span><a href="#">more info»</a></span></div>
</div>
这是我的脚本让它全部发生:
<script>
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready
$(document).ready(function() {
// enable tooltip for "test" element. use the "slide" effect
$("#test").tooltip({
effect: 'slide',
offset: [50, 40] });
$("#test2").tooltip2({
effect: 'slide',
offset: [50, 40] });
});
</script>
但不工作请帮忙。这是我正在尝试的sample Jquery
答案 0 :(得分:1)
$("#test2").tooltip({ // You had .tooltip2
effect: 'slide',
offset: [50, 40] });
});
<强>解释强>
工具提示插件提供了一个名为tooltip
的函数,它是jQuery对象的一部分。一旦你加载了jquery和工具提示插件,你创建的每个jquery对象[FYI:$(selector)
创建一个jquery对象]就可以自己调用该函数。
当您致电tooltip2()
时,您正在调用一个不存在的函数,因此没有任何反应。
这有意义吗?
答案 1 :(得分:0)
我会为html尝试这个......
<!-- trigger element. a regular workable link -->
<a id="test" title="Name - Title">Name</a>
<!-- tooltip element -->
<div class="tooltip">
<div><span class="name">Name</span><br />
Title
<span><a href="#">more info»</a></span></div>
</div>
<!-- trigger element. a regular workable link -->
<a id="test2" title="Name - Title">Name</a>
<!-- tooltip element -->
<div class="tooltip">
<div><span class="name">Name</span><br />
Title
<span><a href="#">more info»</a></span></div>
</div>
这是javascript ...
<script>
// What is $(document).ready ? See: http://flowplayer.org/tools/using.html#document_ready
$(document).ready(function() {
// enable tooltip for "test" element. use the "slide" effect
$("#test, #test2").tooltip({
effect: 'slide',
offset: [50, 40] });
});
</script>